body {
background: #9cdcf9 url(/images/left_cloud.png) bottom left no-repeat;
font-family:\"Trebuchet MS\";
padding:0;
margin:0;
border:0;
}
#cloud-container {
width: 100%;
background: url(/images/right_cloud.png) bottom right no-repeat;
height: 100%;
}
#plane-container {
width: 100%;
background: url(/images/plane.png) top right no-repeat;
height: 20%;
}
#footer1 {
width:100%;
height: 180px;
background: url(/images/footer.png) bottom center repeat-x;
vertical-align: bottom;
text-align: center;
color: #fff;
text-shadow: #555 1px 1px 1px;
font-size: 11px;
}Works really well in Firefox, however, it causes alignment issues and overlapping divs in Internet Explorer. Is there something specific in the CSS that IE is struggling with? It might be a bit of a stretch, but any insights would be greatly appreciated.