Repeating y-axis background not properly functioning in IE7.
Included are images of how the image looks in every explorer except IE7 and the IE7 version. Images are linked from Image Shack.
Functional version: Click here
IE7 Version: Click Here
Here is my code
HTML
CSSCode:<div id="BodyWrap">
<div id="Header">
Header Content
</div>
<div id="ContentWrap">
<div id="Content">
Lorem Ipsum
</div>
</div>
</div>
<div id="Footer">
</div>
In the IE7 specific style sheet the footer's display attribute is set to none to show exactly what the background image is doing. Otherwise the top of the footer would sit where the drop shadow area ends.Code:CSS Styles
#BodyWrap
{
background: url("/ContentBackground.png") repeat-y scroll center top transparent;
color: #332921;
height: 100%;
margin-left: auto;
margin-right: auto;
padding-bottom: 5px;
padding-left: 20px;
padding-right: 20px;
width: 1000px;
}
#ContentWrap
{
clear: both;
height: 100%;
width: 1000px;
}
#Content
{
float: left;
margin: 35px 30px 0;
width: 865px;
}
