Labtec
-
Posts
117 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Everything posted by Labtec
-
Here is the updated CSS. Give it a go, I'm not about the styles on your footer_text element but it works fine for me. nav.footer{ position:relative; height: 40px; padding-top:0px;}nav.footer ul{ margin:0; text-align: center; padding:0;}nav.footer ul li{ list-style-type:none; padding:0px; display: inline; margin:7px; background:none;}nav.footer ul li a {color:#727374;}nav.footer ul li a:hover, nav.footer ul li.current-menu-item a {color:#fff;} Hope this helps. Regards, Lab.
-
Can you post the HTML please? Regards, Lab.
-
You can do it in the exact same place. #navbar ul li a { text-decoration: none; padding: 1em 2em; font-size: 16pt; /*for example*/ color: #fff; background-color: #000;} Regards, Lab.
-
Yes you can edit the padding values on the anchors (<a>): #navbar ul li a { text-decoration: none; padding: 1em 2em; color: #fff; background-color: #000;} Try these values and see what you think. Regards, Lab.
-
You can float your image left and then set your UL to display text to the right: html, body{ margin:0; padding:0;}img{ position:left,top;}body{ background-color:#333333;}#navbar{ background-color: purple;}#logo{ float: left;}#navbar ul { margin:1px; padding: 5px; list-style-type: none; text-align: right;}#navbar ul li { height:50px; display:inline;}#navbar ul li a { text-decoration: none; padding: .2em 1em; color: #fff; background-color: #000;}#navbar ul li a:hover { color: #000; background-color: #fff;} HTML: <div id="navbar"> <img src="yourlogo.png" alt="Logo" id="logo" /> <ul> <li><a href="#">Home</a></li> <li><a href="#">...</a></li> <li><a href="#">...</a></li> <li><a href="#">...</a></li> <li><a href="#">...</a></li> <li><a href="#">...</a></li> <li><a href="#">...</a></li> <li><a href="#">...</a></li> </ul> </div> Hope this helps. Regards, Lab.
-
He took out your float: center declarations. Also on the html,body element, he took off the margin and padding. Either html or body has a slight margin by default. Kind regards, LC.
-
Can you post the HTML which goes with it please? There are some errors such as float: center which isn't correct. If you post the HTML i'd be more than happy to sort it out for you. Regards, Lab.
-
If you want to see if they work, put var_dump($qoute); just before the end of both functions. This should tell you whether the function is executing correctly and also tell you what the value is after it has performed any conditions within the function. Regards, Lab.
-
How advanced are your CSS skills? I really believe jQuery can add a lot of nice features to your site, even if it's fading something out or moving something across screen to a fadeOut() or sliding something up/down. I find the little things add style. Like dave said, rounded borders do A LOT for an appearance. I had a site live where I had no rounded borders, as I continued to work locally, I decided to put rounded borders on most of my content and when I compare it, the rounded borders version looks much more appealing on the eye than the one without rounded borders. Another little example could be adding :focus psuedo class to your <form> elements so when they are focused on, they change to a slightly darker/ligher version of the original color. I must admit though, I struggle at creating visually stunning websites, I just can't seem to get my sites exactly how I would like them. I'm on the same search as you to be honest. Kind regards, Lab.
-
Not sure if you got it working or how you got it working, but you could do this: #DivText { width:928px; height:950px; top:250px; margin-left:auto; margin-right:auto; text-align: left } You can explicitly set the text-align to left, but it aligns left by default anyway. For example if you set a text-align: center on a parent container, every child aligns to the center, unless you explicitly give them text-align: left style. What you have posted in your first post works fine for me. Regards, Labby.
-
You can do it a number of ways. Conside these codes: First one using floating: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HTML Template</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="jquery-1.8.3.js"></script><style type="text/css">#main{ background: #0000ff; width: 80%; margin: auto; padding: 1%; height: 400px;}#leftdiv{ width: 45%; background: #ff0000; height: 400px; float: left; }#rightdiv{ width: 45%; background: #00ff00; height: 400px; float: right; }</style><script></script></head><body><div id="main"> <div id="leftdiv">Left div</div> <div id="rightdiv">Right div</div></div></body></html> Second one using display:inline-block <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HTML Template</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="jquery-1.8.3.js"></script><style type="text/css">#main{ background: #0000ff; width: 80%; margin: auto; padding: 1%;}#main > div{ width: 45%; background: #ff0000; height: 400px; display: inline-block; margin: 1%; }</style><script></script></head><body><div id="main"> <div>Left div</div> <div>Right div</div></div></body></html> Does this help at all. Of course you can see both concepts. You give <div>'s a style of display: inline-block to make them appear inline, but to also make them keep their appearance. The div is a block level element. Regards, Lab.
-
For one you haven't got a query. You're not checking the input against any records. You're also passing $result to mysql_num_rows(), which hasn't been set. Try something like: $host="localhost"; //$username="root"; //$password=""; //$db_name="westpop"; //$tbl_name="leden"; // mysql_connect($host, $username, $password)or die("cannot connect");mysql_select_db($db_name)or die("cannot select DB"); $myusername=$_POST['myusername'];$mypassword=$_POST['mypassword']; $result = mysql_query("SELECT * FROM $tbl_name WHERE username='{$myusername}' AND password='{$mypassword}'"); $count=mysql_num_rows($result); if($count==1){ session_register("myusername"); session_register("mypassword"); header("location:login_succes.php"); } else { echo "Wrong Username or Password"; } This is assuming your table field for the username and pass is 'username' and 'password'. If it isn't just change the query to suit the table field names. Regards, Lab.
-
See dsonesuk's post at #5. Using display: none will affect the 'jumping'. By using visibility: hidden the elements keep their position on the page and prevent the 'jumping'. Regards, Lab
-
You can apply visibility: hidden to your HTML: <div id="div1" style="width:80px;height:80px;background-color:red; visibility: hidden;"></div> Of course it depends what method you want to use, there are many ways to do it. Regards, Lab
-
Hehe quality Although you know inline styles are frowned upon unless absolutely necessary dsonesuk's example wins I think though, give it a try ^ Regards, Labb
-
Inside your CSS file, use your text editors 'Find' function and search for: "a:hover". Just completely delete that and it will stay the same color when you hover over it. Although without seeing the CSS, I hard to be accurate. If you post your CSS file, I'll identify the area you need to delete. Regards, Lab.
-
You can style it like so: <a href="some_page.php" class="red_link">if</a> Then in your CSS: .red_link{ color: red;} Kind regards, Lab!
-
I've had a quick look at your code and got it to work as you wanted. It isn't the best code, but it works: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HTML Template</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="jquery-1.8.3.js"></script><style type="text/css"> .hide{ display: none;}</style><script>$(document).ready(function(){ var div1 = $('#div1'), div2 = $('#div2'), div3 = $('#div3'); div1.addClass('hide'); div2.addClass('hide'); div3.addClass('hide'); $("button").click(function(){ div1.fadeToggle(), div2.fadeToggle("slow"), div3.fadeToggle(3000); });}); </script> </head> <body> <p>Demonstrate fadeToggle() with different speed parameters.</p><button>Click to fade in/out boxes</button><br><br> <div id="div1" style="width:80px;height:80px;background-color:red;"></div><br><div id="div2" style="width:80px;height:80px;background-color:green;"></div><br><div id="div3" style="width:80px;height:80px;background-color:blue;"></div> </body></html> This hide's your div's when the page first loads, then when you click the button anytime after that, it will either show/hide the divs. This probably isn't the best way to do it, I'd suggest using removeClass in conjunction with the fadeToggle() function because even when the <div>'s are visible on the screen, they still have the hide class applied, which probably isn't ideal. Hope it helps, Regards, Lab.
-
Yup, classes can be applied to multiple elements on a single page, whereas ID's can only be used once on any given page. ID's are also used to allow JS to identify a certain element. For example, if you want to grab an element with a certain ID and perform some sort of action on that element, you use JS to identify it like so: <div id="element_id"></div> var element = document.getElementById('element_id'); P.S - you don't have to save it to a variable, you can perform another action such as writing innerHTML to the page like: document.getElementById('element_id').innerHTML = someValue; Hope this helps, Kind regards, Lab.
-
Is there a place I can go to read the rules for HTML and CSS
Labtec replied to e_a_g_l_e_p_i's topic in HTML/XHTML
The best advice I can give you is, as Weezy said, learn the basics of the technologies which you wish to learn. Once you understand the basic concept/syntax, just create a random web page, trying to use as many techniques as possible. I learnt just by creating random sites and testing syntax. I think a lot of it is trial and error. Sometimes you will get stuck and even after trying everything you know, will still need some help from forums. I have had a lot of help from forums regarding web design. Sometimes it takes someone to actually explain it in leymans terms before you can fully understand it. First start with HTML and CSS, create a random site, trying to implement as many different techniques as you possibly can, then once you feel you have become quite good at CSS, go for learning PHP or JavaScript. (I'd suggest going for PHP first). Kind regards, Lab. -
You could use some JS/Jquery to determine the <li> x-y co-ordinates and then position your dropdown relative to that using position absolute? Of course this would make it JS dependent which I'm not sure if this is an option for you. Kind regards, Lab.
-
What do yuou mean by an "association between the sentence and the table"? You can use an element such as a <span> tag within a <p> as it is inline and has no margin or padding values by default, IIRC. I always use <span>'s inside <p> elements if I want a different style applied to an area of text. Regards, Lab.
-
Just to note, classes can be used multiple times on ONE page. This is correct: <div class="redclass"></div><h2 class="redclass">BlaBla</h2> BUT, you can use ID's only ONCE in any given page, so this is incorrect: <div id="redclass"></div><h2 id="redclass">BlaBla</h2> Hope this helps a little. Kind regards, Lab
-
Good news. Ok i'll have to have little play around as I'm not 100% in Javascript. Hopefully, someone can come and help you in the meantime. I don't think it is much work, maybe just saving the time at which it was stopped, then when resuming, comparing the difference to the current time and then subtracting it off the current time. If I remember JS is a little complicated when dealing with the crossover of days. I'll have a go but I reckon someone will post an answer before I get a chance to get it working. I will have a go at it right now. Regards, Labb
-
Hello, I just had a play around with your script and got it working, although when you resume the clock, it goes straight to the present time, as you could guess. If you stop it at 08:33:20 and leave it for 40s it will display 08:34:00. Not sure if you want it to resume from the time it was stopped? Here is the code: <body> <p>A script on this page starts this clock:</p><p id="demo"></p><button onclick="myStartFunction()">Start time</button><button onclick="myStopFunction()">Stop time</button> <script>var myVar=setInterval("myTimer()",1000);function myTimer(){ var d=new Date(); var t=d.toLocaleTimeString(); document.getElementById("demo").innerHTML=t;}function myStopFunction(){ clearInterval(myVar);} function myStartFunction(){ myVar = setInterval("myTimer()",1000);} </script> </body> It probably needs cleaning up but it works! Kind regards Lab.
