Freon Posted August 14, 2013 Share Posted August 14, 2013 Hello, I'm puzzled by what it seems to be two pages with the same code and acting differently at the same time. In the index.html the page behaves the way I want: the content adapts after resizing the browser but I get unusable space where header and content meets. In the index2.html there's no unused space but when I try to shrink the browser the content element jumps off below menu. Tell me if I need some sleep to find an error in the code because right now I see the code is 1:1. index.html <!DOCTYPE html> <html> <title>Alpha</title> <body> <style> p.ex1 {margin-left:6cm;} </style> <div id="container" style="width:1000px text-align:center";> <div id="header" style="background-color:#005aff; height:60px;" align="center"> <h1 style="margin-bottom:0;"> Main Title of Web Page </h1></div> <div id="menu" style="background-color:#000714; height:850px; width:200px; float:left; text-align:center"> <font color="green"> Menu <br/> <b> HTML<br/> CSS<br/> JavaScript</b> </font></div> <div id="content" align="left" style="background-color:#EEEEEE; height:850px; width:800px float:left;"> <p class="ex1"> Content goes here </p></div> <div id="footer" style="background-color:#005aff; clear:both; text-align:center;"> 2013-08-14</div> </div> </body> </html> index2.html <!DOCTYPE html> <html> <title>Alpha</title> <body> <style> p.ex1 {margin-left:0.5cm;} </style> <div id="container" style="width:1000px text-align:center" ; > <div id="header" style="background-color:#005aff; height:60px;" align="center"> <h1 style="margin-bottom:0;">Main Title of Web Page</h1></div> <div id="menu" style="background-color:#000714;height:850px;width:200px;float:left; text-align:center"> <font color="green"> <b>Menu</b><br/> HTML<br/> CSS<br/> JavaScript </font></div> <div id="content" align="left"; style="background-color:#EEEEEE;height:850px;width:800px;float:left;" > <p class="ex1"> Content goes here </p></div> <div id="footer" style="background-color:#005aff;clear:both;text-align:center;"> 2013-08-14</div> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/281177-what-is-the-difference-between-those-two-web-pages/ Share on other sites More sharing options...
kicken Posted August 14, 2013 Share Posted August 14, 2013 (edited) index.html <div id="content" align="left" style="background-color:#EEEEEE; height:850px; width:800px float:left;"> index2.html <div id="content" align="left"; style="background-color:#EEEEEE;height:850px;width:800px;float:left;" > You're missing a ; after the width specification in the first one. Both the float and the width rules are ignored as a result. You also have a few stray ; in places they do not need to be, such as the one after align="left" in the second block there. Edited August 14, 2013 by kicken Quote Link to comment https://forums.phpfreaks.com/topic/281177-what-is-the-difference-between-those-two-web-pages/#findComment-1445086 Share on other sites More sharing options...
Freon Posted August 15, 2013 Author Share Posted August 15, 2013 Thank you! I found few ; misplaced. Quote Link to comment https://forums.phpfreaks.com/topic/281177-what-is-the-difference-between-those-two-web-pages/#findComment-1445106 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.