BoltZ Posted December 7, 2008 Share Posted December 7, 2008 Hey I am trying to get all this stuff in the div top nav to be on one line in the blue box and I cant for the love of me get it. www.devwebsites.com/Tutorializing Quote Link to comment https://forums.phpfreaks.com/topic/135985-just-some-inline-issues/ Share on other sites More sharing options...
dropfaith Posted December 7, 2008 Share Posted December 7, 2008 set a width and float one left one right and let the center one just sit there id say 16% width should work for all of them and leave 2% unaccounted for to use as a padding for the elements Quote Link to comment https://forums.phpfreaks.com/topic/135985-just-some-inline-issues/#findComment-708881 Share on other sites More sharing options...
BoltZ Posted December 8, 2008 Author Share Posted December 8, 2008 I have width: 50% for the containing div. Any other idea? Here is the code <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Tutorializing - Directory of tutorials for scripting websites and programming.</title> <link rel="icon" type="image/jpeg" href="images/favicon.jpg" /> <style type="text/css"> .logo { margin-left:10px; margin-top:5px; position:absolute; float:left; width:50%; height:100px; } .topnav{ background-color: #0d4e90; width:50%; margin-top:0px; margin-right:0px; height:25px; float:right; color: #FFFFFF; font-weight:bold; font-size:16px; } </style> </head> <body> <div class="logo"> <img src="images/logo.jpg" alt="banner" /> </div> <div class="topnav"> <div style="padding-left:40px; display:inline;">Tutorials: <script type="text/javascript"> function goto(form) { var index=form.select.selectedIndex if (form.select.options[index].value != "0") { location=form.select.options[index].value;}} </script> <form name="form1" action="#"> <select name="select" onchange="goto(this.form)" size="1"> <option value="" />------Select------ <option value="#" />HTML <option value="#" />CSS <option value="#" />JavaScript <option value="#" />PHP <option value="#" />MySQL <option value="#" />Ajax <option value="#" />SEO</select> </form></div> <div style="padding-left:50px; display:inline;">Forums: <form name="form2" action="#"> <select name="select" onchange="goto(this.form)" size="1"> <option value="" />------Select------ </select> </form> </div> <div style="padding-left:50px; display:inline;">Resources: <form name="form3" action="#"> <select name="select" onchange="goto(this.form)" size="1"> <option value="" />------Select------ </select> </form> </div> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/135985-just-some-inline-issues/#findComment-708896 Share on other sites More sharing options...
BoltZ Posted December 8, 2008 Author Share Posted December 8, 2008 oK i got it all fixed by the floats but I cant get the stuff on one line. Look at www.devwebsites.com/Tutorializing see what I am talking about. Note that width doesnt matter. Even with only one of the drop downs it still doesnt do one line.. <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Tutorializing - Directory of tutorials for scripting websites and programming.</title> <link rel="icon" type="image/jpeg" href="images/favicon.jpg" /> <style type="text/css"> .logo { margin-left:10px; margin-top:5px; position:absolute; float:left; width:50%; height:100px; } .topnav{ background-color: #0d4e90; width:50%; margin-top:0px; margin-right:0px; height:25px; float:right; color: #FFFFFF; font-weight:bold; font-size:16px; } </style> </head> <body> <div class="logo"> <img src="images/logo.jpg" alt="banner" /> </div> <div class="topnav"> <div style="padding-left:40px; display:inline; float:left;">Tutorials: <script type="text/javascript"> function goto(form) { var index=form.select.selectedIndex if (form.select.options[index].value != "0") { location=form.select.options[index].value;}} </script> <form name="form1" action="#"> <select name="select" onchange="goto(this.form)" size="1"> <option value="" />------Select------ <option value="#" />HTML <option value="#" />CSS <option value="#" />JavaScript <option value="#" />PHP <option value="#" />MySQL <option value="#" />Ajax <option value="#" />SEO</select> </form></div> <div style="padding-left:50px; float:right; display:inline;">Forums: <form name="form2" action="#"> <select name="select" onchange="goto(this.form)" size="1"> <option value="" />------Select------ </select> </form> </div> <div style="padding-left:50px; display:inline; float:left;">Resources: <form name="form3" action="#"> <select name="select" onchange="goto(this.form)" size="1"> <option value="" />------Select------ </select> </form> </div> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/135985-just-some-inline-issues/#findComment-708904 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.