hi ive put this two divs one aligned left and one right. but for some reason
the main content is not staying inbetween them it seem to be pushing it away.


css-----------------------------------------------------------------------------
----------------------------------------------------

body, html{
margin: auto;
padding: 0px;
height: 100%;
text-align: center;
background-image: url(Images/bg_pattern.jpg);
}
#wrapper {
width: 903px;
margin: auto;
}
#links {
height: 38px;
margin: auto;
width: 769px;
text-align: center;
}
#banner {
padding-bottom: 11px; /* LOOK MA! NO GREEN BAR !!! */
margin: auto;
height: 166px;
width: 769px;
background-color: #6DCC3E;
}
#content {
margin: auto;
padding: 20px 0px;
width: 769px;
background-image: url(Images/Content_bg.jpg);
}
#description { /* used to be left column */
height: 721px;
width: 201px;
float: left;
background-color: #C9C9C9;
margin: 0px 0px 0px 11px;
}
#LeftShadow {
float: left;
width: 67px;
background-image: url(Images/Left_shadow.jpg);
height: 1040px;
}
#RightShadow {
float: Right;
width: 67px;
background-image: url(Images/Right_shadow.jpg);
height: 1040px;
}
.descriptionText { /* Text within description */
padding: 10px;
font-size: 11px;
text-align: left;
color: #ffffff;
background-color: #999999;
margin: 0px 15px;
font-family: tahoma, sans-serif;
}
h1 { /* custom header */
font-size: 12px;
text-align: center;
background-color: #ffffff;
color: #6DCC3E;
padding: 2px 20px;
border-left: 4px solid #6DCC3E;
border-bottom: 1px solid #6DCC3E;
font-family: Arial, Helvetica, sans-serif;
}
h2 { /* second custom header within category */
margin-bottom: 0px;
margin-top: 10px;
font-size: 16px;
text-align: left;
font-weight: normal;
padding: 2px 0px;
color: #ffffff;
border-bottom: 4px dotted #ffffff;
font-family: Arial, Helvetica, sans-serif;
}
h2:first-letter { /* Dotted box used as number */
margin: 0px 4px;
padding: 5px;
font-size: 30px;
float: left;
display: block;
color: #ffffff;
background-color: #6DCC3E;
font-family: Arial, Helvetica, sans-serif;
}
.category { /*category container box */
float: right;
width: 503px;
margin-top: 0px;
margin-right: 11px;
margin-bottom: 7px;
margin-left: 0px;
}
.categoryText { /* Text within each category */
color: #ffffff;
padding: 0px 0px 0px 10px;
line-height: 16px;
font-family: Arial, Helvetica, sans-serif;
}
img.cagetoryImageLeft { /* Left category image */
float: left;
}
img.cagetoryImageRight { /*Right category image */
float: right;
}
#footer { /* new and improved footer */
margin: auto;
height: 15px;
width: 769px;
font-size: 10px;
text-align: center;
background-color: #000000;
color: #eeeeee;
font-family: Arial, Helvetica, sans-serif;
}
.holderLeft { /* green box in category */
background-color: #66CC33;
float: left;
height: 175px;
width: 248px;

}
.holderRight { /* green box in category */
float: right;
width: 248px;
background-color: #66CC33;
height: 175px;
}

html view on the source
--------------------------------------------------------------------------------
-----------------------
[url]http://www.funnycrew.co.uk/nwms/New%5Fcss/Photography.html[/url]