Home/ Questions/Q 7524069
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T02:59:03+00:00

pxI created a style defenition like this: #container { width: 900px; margin: 0 auto;

  • 0

pxI created a style defenition like this:

#container {
width: 900px;
margin: 0 auto;
background-image:url(images/back.JPG);
}
#header {
width: 900px;
height: 200px;
background-image:url(images/logo2.jpg);
border-bottom: 2px solid #000;
}
#leftnav {
float:left;
width: 150px;
height: 500px;
}
#rightnav {
float:right;
width: 150px;
height: 500px;
}
#body {
margin-left: 150px;
width: 600px;
text-align:center;
background-image:url(images/tb.png);
}
#footer {
clear:both;
background-image:url(images/tb.png);
}

Then I created a index file like that used the container around everything, then put the header, then leftnav, then rightnav, then body, then footer.

This works greate on Chrome and firefox, but on IE, the “BODY” container is not where it is supposed to be, it starts under the “leftnav” container. Is there a simple fix for this?

Updated cod from first answer, still same problem.

My index file is a php file.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You don’t have units defined on #body‘s width. Should be width: 600px;
    Also, remove margin-left: 150;

    Try this. It works in IE7 for me. I think you were just missing a doctype.

    <!DOCTYPE html>

<html>
<head>
<title>Test for StackOverflow</title>
<style>
#container {
    width: 900px;
    margin: 0 auto;
    background-image:url(http://www.uffdarc.com/cantonspeedway/images/back.JPG);
}

#header {
    width: 900px;
    height: 200px;
    background-image:url(http://www.uffdarc.com/cantonspeedway/images/logo2.jpg);
    border-bottom: 2px solid #000;
}

#leftnav {
    float:left;
    width: 150px;
    height: 500px;
}

#rightnav {
    float:right;
    width: 150px;
    height: 500px;
}

#body {
    margin-left: 150px;
    width: 600px;
    text-align:center;
    background-image:url(http://www.uffdarc.com/cantonspeedway/images/tb.png);
}

#footer {
    clear:both;
    background-image:url(http://www.uffdarc.com/cantonspeedway/images/tb.png);
}
</style>
</head>

<body>

<div id="container">

<div id="header">

</div>
<div id="leftnav"> 
  <img src="http://www.uffdarc.com/cantonspeedway/images/p1.jpg" width="140" height="140"><br>
  <br>
  <img src="http://www.uffdarc.com/cantonspeedway/images/p2.jpg" width="140" height="140"><br>
  <br>
  <img src="http://www.uffdarc.com/cantonspeedway/images/p6.jpg" width="140" height="80"><br>

</div>
<div id="rightnav"> 
  <img src="http://www.uffdarc.com/cantonspeedway/images/p3.jpg" width="140" height="80"><br>
  <br>
  <img src="http://www.uffdarc.com/cantonspeedway/images/p4.jpg" width="140" height="80"><br>
  <br>
  <img src="http://www.uffdarc.com/cantonspeedway/images/p5.jpg" width="140" height="80"><br>

</div>
<div id="body"> This Page is still under construction <br>
  <br>
  <img src="http://www.uffdarc.com/cantonspeedway/images/logo3.jpg" width="550" height="362"> <br>
  <br>
</div>
<div id="footer">

</div>

</div>
</body>
</html>
    • 0