Mon, 2013-03-25 17:44
I created sample html from SamsTeachYourself and it does not work correctly. I checked my code at W3 and it was fine.
The middle content <div> is not expanding to maximum width of screen.
#content_area { position: relative; float: left; background-color: #ffffff; padding-bottom: 2000px; margin-bottom: -2000px; width: 100%; }
//mod edit: The following added from semi-duplicate post. (Reply to original post instead of starting a new topic) ~gt
#right_side { position: relative; float: left; width: 200px; background-color: #52f471; margin-right: -200px; margin-bottom: -2000px; padding-bottom: 2000px; } #left_side { position: relative; float: left; width: 200px; background-color: #52f471; right: 200px; margin-left: -100%; margin-bottom: -2000px; padding-bottom: 2000px; }
</style> </head> <body> <div id="header"> <img src="gpf_canada.png" alt="Corp. Logo" width="125" height="100" style="float:left; margin:5px"/> <img src="airmiles.png" alt="AirMiles" width="100" height="100" style="float:right; margin: 5px"/> </div> <div id="wrapper"> <div id="content_area">CONTENT</div> <div id="left_side">LEFT SIDE</div> <div id="right_side">RIGHT SIDE</div> </div> <div id="footer"> <p> © 2217617 Ontario Inc. March 2013 </p> </div> </body> </html>
//mod edit: source code should be wrapped in code tags. Use the "code" button above the text-area, or use bbcode tags, [code] [/code]. Fixed. ~gt
Wed, 2013-03-27 00:52
#1
You need to post ALL your code
You've left out styles for #header, #wrapper, #footer.