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> 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 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. 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. 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
Archived
This topic is now archived and is closed to further replies.