Question

Im preparing website page structure but stuck here

Html

<div id="main">
   <div id="left"></div>
   <div id="content"></div>
   <div id="right"></div
</div>

css

#main
{
  background: url("../images/bkg_main1.gif") no-repeat scroll 50% 0 #FBFAF6;
  width: 100%;
}
#left
{
  float:left;
}
#content
{
  width:997px;
  margin:0 auto;
}
#right
{
  float:right;
}

left div should appear in the left side of page it is appearing and the content div should appear in the middle, it is also appearing in the middle and right div should appear in the right side of page. The right div is appearing in the right side of page but it is appearing at the right-bottom corner.

Answer 1

try this way

<div id="main">
   <div id="left"></div>
    <div id="right"></div>
   <div id="content"></div>   
</div>