943,898 Members | Top Members by Rank

Web Development > Web Design > HTML and CSS > Float left not working???
Ad:
Permalink
Apr 9th, 2009
0

Float left not working???

Expand Post »
Can anyone tell me why "Main" Div will not float left next to "Menu" div?

I can't seem to get it to go up.

Thank you!

Phil


html Syntax (Toggle Plain Text)
  1. <html>
  2. <head>
  3. <style type="text/css">
  4.  
  5. div#container {
  6. 	font-family: "Lucida Grande", Verdana, Arial, sans-serif;
  7. 	font-size: 20px;
  8. 	width: 1000px;
  9. 	height: auto;
  10. }
  11.  
  12. div#title {
  13. 	background-color: #ff638d;
  14. 	text-align: center;
  15. 	font-size: 300px;
  16. 	}
  17.  
  18. div#menu {
  19. 	background-color: #0586b8;
  20. 	text-align: right;
  21. 	font-size: 50px;
  22. 	width: 300px;
  23. 	}
  24.  
  25. div#main {
  26. 	float: left;
  27. 	width: 500px;
  28. 	background-color:gray;
  29.     }
  30.  
  31.  
  32. </style>
  33.  
  34.  
  35. </head>
  36.  
  37.  
  38. <div id="container">
  39.  
  40.  
  41. 	<div id="title">
  42. 	Title
  43. 	</div>
  44.  
  45. 		<div id="menu">
  46.  
  47. 		<li>Menu 1</li>
  48. 		<li>Menu 2</li>
  49. 		<li>Menu 3</li>
  50. 		<li>Menu 4</li>
  51. 		<li>Menu 5</li>
  52. 		<li>Menu 6</li>
  53. 		<li>Menu 8</li>
  54. 		<li>Menu 9</li>
  55. 		<li>Menu 10</li>
  56. 		<li>Menu 11</li>
  57. 		<li>Menu 12</li>
  58.  
  59. 		</div>
  60.  
  61.  
  62.  
  63. 		<div id="main">	
  64.  
  65. 		<p>Main</p>
  66.  
  67. 		</div>
  68.  
  69.  
  70.  
  71. </div>
  72.  
  73.  
  74.  
  75. </html>
Last edited by Ezzaral; Apr 9th, 2009 at 4:55 pm. Reason: Added [code] [/code] tags. Please use them to format any code that you post.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
plarsen111 is offline Offline
24 posts
since Dec 2007
Permalink
Apr 9th, 2009
1

Re: Float left not working???

wrap your code in
[code=language]
code
[/code] tags leave out the blank lines
it makes it easier to read

use proper html doctypes if you want to use attributes of those doctypes
<html> means html 2.0 = no floats
html Syntax (Toggle Plain Text)
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
fun isn-nit
float the menu left
Last edited by almostbob; Apr 9th, 2009 at 4:59 pm.
Reputation Points: 562
Solved Threads: 368
Posting Maven
almostbob is offline Offline
2,970 posts
since Jan 2009
Permalink
Apr 9th, 2009
0

Re: Float left not working???

Thank you!
Reputation Points: 10
Solved Threads: 0
Newbie Poster
plarsen111 is offline Offline
24 posts
since Dec 2007
Permalink
Apr 10th, 2009
0

Re: Float left not working???

dude, just add "float:left" in #main id....it will work !!

Cheers
Reputation Points: 10
Solved Threads: 0
Unverified User
hitz is offline Offline
1 posts
since Aug 2008
Permalink
Apr 19th, 2009
0

Re: Float left not working???

try to use
HTML and CSS Syntax (Toggle Plain Text)
  1. float: left;
to #menu

and
HTML and CSS Syntax (Toggle Plain Text)
  1. float: right;
to #main
Reputation Points: 10
Solved Threads: 10
Junior Poster in Training
rudevils is offline Offline
80 posts
since Jan 2008

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: Texarea Firefox problem
Next Thread in HTML and CSS Forum Timeline: CSS drop down menu over flash run by javascript problem





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC