unknown87 Posted October 28, 2008 Share Posted October 28, 2008 <style type="text/css"> <!-- #container { width: 90%; margin: 10px auto; background-color: #fff; color: #333; border: 1px solid gray; line-height: 130%; } #top { padding: .5em; background-color: #ddd; border-bottom: 1px solid gray; } #top h1 { padding: 0; margin: 0; } #leftnav { float: left; width: 160px; margin: 0; padding: 1em; } #content { margin-left: 200px; border-left: 1px solid gray; padding: 1em; max-width: 36em; } #footer { clear: both; margin: 0; padding: .5em; color: #333; background-color: #ddd; border-top: 1px solid gray; } #leftnav p { margin: 0 0 1em 0; } #content h2 { margin: 0 0 .5em 0; } --> </style> <div id="container"> <div id="top"> <h1>Header</h1> </div> <div id="leftnav"> <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut. </p> </div> <div id="content"> <h2>Subheading</h2> <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </p> <p> Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p> </div> <div id="footer"> Footer </div> </div> My web pages are displaying much larger in Internet Explorer than Firefox. I want my pages to look identical in both browsers. Look at sample code so you know what i'm talking about. Could someone tell me where im going wrong? Thanks in advance Quote Link to comment Share on other sites More sharing options...
cooldude832 Posted October 28, 2008 Share Posted October 28, 2008 read what a em unit means Quote Link to comment Share on other sites More sharing options...
BoltZ Posted October 28, 2008 Share Posted October 28, 2008 Also can you post the complete code or give us a link so we can see "how much larger" it is in ie then firefox? For all we know that extra space could be from ie's double float margin bug Quote Link to comment Share on other sites More sharing options...
unknown87 Posted October 29, 2008 Author Share Posted October 29, 2008 the code i have posted above is the same but with different content Quote Link to comment Share on other sites More sharing options...
BoltZ Posted October 29, 2008 Share Posted October 29, 2008 We have no idea where those divs and id's are pplaced. we need a link so we can see how it spreads out on your site and what the error is caused by. If you don't want to post a link then post your entire html code plz Quote Link to comment Share on other sites More sharing options...
unknown87 Posted October 29, 2008 Author Share Posted October 29, 2008 that is all the code - i just realised, i haven't put the doctype and stuff at the top. Could that be the problem? Quote Link to comment Share on other sites More sharing options...
BoltZ Posted October 29, 2008 Share Posted October 29, 2008 Dude you don't get it. We need MORE THEN THE CSS. Post a LINK or your entire HTML CODE and we can HELP. We HAVE your css, we NEED your HTML and yes a doctype could cause errors. use xhtml transitional doctype to start yourself out define stuff... Quote Link to comment Share on other sites More sharing options...
unknown87 Posted October 29, 2008 Author Share Posted October 29, 2008 if you look at the bottom of the code you will see the html code. As of yet, i have not put the css code in its own stylesheet. Quote Link to comment Share on other sites More sharing options...
BoltZ Posted October 29, 2008 Share Posted October 29, 2008 <!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"> <head> <title>Page</title> <style type="text/css"> #leftnav { float: left; width: 160px; margin: 0; padding: 1em; } #content { margin-left: 200px; border-left: 1px solid gray; padding: 1em; max-width: 36em; } #footer { clear: both; margin: 0; padding: .5em; color: #333; background-color: #ddd; border-top: 1px solid gray; } #leftnav p { margin: 0 0 1em 0; } #content h2 { margin: 0 0 .5em 0; } --> </style> </head> <body> <div id="container"> <div id="top"> <h1>Header</h1> </div> <div id="leftnav"> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut.</p> </div> <div id="content"> <h2>Subheading</h2> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p> <p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p> </div> <div id="footer">Footer</div> </div> </body> </html> Is this what you tried? i added a doctype and formatted your code correctly. Are you new to html? If so remember these points 1. keep css in <style type="text/css"> tag if your embedding it straight into the document 2. always use a doctype. if you don't that could be the reason for having errors 3. validate your pages 4. use <html><head></head><body></body></html> as the main setup of webpages Quote Link to comment 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.