jasonc Posted October 4, 2010 Share Posted October 4, 2010 Just starting out and have a problem with IE not showing the page in the center of the browser. works in FireFox. What do I need to change to make it show in the middle? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <head> <title>Title</title> <meta http-equiv="Content-Type" content="text/html;"> <style type="text/css"> #header { height:118px; margin-bottom: 20px; background-image:url('images/back-navy.gif'); } #content-center { width: 520px; padding: 0 10px; float: left; display: inline; background-color: #DCDDDB; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } #sidebar-left { width: 120px; background-color: #DCDDDB; margin: 0 10px; float: left; display: inline; } #wrapper { width: 820px; margin: 0 auto; background-color: #7E8079; background-image: url('images/background-image.gif'); } #sidebar-right { width: 120px; background-color: #DCDDDB; margin: 0 10px; float: left; display: inline; } #footer { height: 18px; margin-top: 20px; background-image: url('images/back-navy.gif'); font-family: Tahoma; font-size: 10pt; color: #FFFFFF; } #footer-left { float: left; padding: 0 20px 0 15px; } #footer-right { float: left; } </style> </head> <body> <div id="wrapper"> <div id="header"> <div style="float:left; width:195px;"><img name="index_r1_c1" src="images/index_r1_c1.gif" width="195" height="118" border="0" alt=""></div> <div style="width:605px; float:left; font-family:Tahoma; font-size: 25pt; color: #FFFFFF; margin: 10px 0 0 20px;">header</div> </div> <div id="content"> <div id="sidebar-left"> <ul style="text-decoration:none; list-style-type:none; margin:0; padding-left:5px;"> <li> </li> <li> </li> <li> </li> <li> </li> </ul> </div> <div id="content-center"> <h1 style="text-align:center;">Welcome</h1> <p>Our site is in developement and will be live shortly.<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> </p> </div> <div id="sidebar-right"> <ul style="text-decoration:none; list-style-type:none; margin:0; padding-left:5px;"> <li> </li> <li> </li> <li> </li> <li> </li> </ul> </div> </div> <br clear="all"> <div id="footer"> <div id="footer-left">left footer</div> <div id="footer-right">right footer</div> </div> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
Colton.Wagner Posted October 5, 2010 Share Posted October 5, 2010 If you will notice you do not have: <html> Defined at the top of the page but this does not fix the problem. You have this as your document type: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> It needs to be replace with: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> This should fix your problem hope I could be some assistance. Thanks, Colton Wagner 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.