I am doing this CSS web page, it works fine on Apple and PC, Safari, Opera, Firefox, but.....surprisingly not working on IE8, how can i fix it? when you shift the windows (open and close) the right hands side panel moves too so it causes a total chaos on the page. This is the web page, and bellow is the CSS code, please help, thanks
MARY WARD DOCUMENTARY
MARY WARD DOCUMENTARY
Code:
@charset "UTF-8";
/* CSS Document */
<style>
body {
margin:0;
padding:0;
text-align:left;
}
body,td,th {
font-size: 12.5px;
font-family: Georgia, Times New Roman, Times, serif;
}
a {
font-family: Georgia, Times New Roman, Times, serif;
font-size: 12.5px;
}
a:link {
text-decoration: none;
color: #09C;
}
a:visited {
text-decoration: none;
color: #06C;
}
a:hover {
text-decoration: none;
color: #FFF;
}
a:active {
text-decoration: none;
}
.white {
color: #FFF;
}
.bold {
font-weight: bold;
color: #FFF;
}
body {
background-color: #2e2209;
}
html>body #content {
text-align:centre;
margin:auto;
background-color:#CCC;
width:900px;
height:1100px;
}
#cabecera {
width: 900px;
height:321px;
background-image:
url(imagesnl/top.jpg);
background-color:
#2e2209;
}
#lhs {
width:116px;
height:339px;
float:left;
background-image:url(imagesnl/lhs.jpg);
background-color:
#2e2209;
}
#contenido {
width:790px;
height:339px;
background-color:#edd8a7;
text-align: left;
vertical-align: text-top;
margin-top:-12.5px;
}
#rhs {
width:110px;
height:779px;
float:right;
background-image:url(imagesnl/rhs.jpg);
margin-top:-339px;
// margin-right:43px; //
background-color:
#2e2209;
}
#mb {
width:790px;
height:262px;
background-image:
url(imagesnl/mb.jpg);
background-color:
#2e2209;
}
#pie {
width:433px;
height:178px;
background-image:url(imagesnl/bhs.jpg);
float:left;
background-color:
#2e2209;
}
#contenido2 {
width:357px;
height:104px;
background-color:#000101;
margin-left:433px;
}
#brhs {
width:357px;
height:74px;
margin-left:433px;
background-image:url(imagesnl/brhs.jpg);
background-color:
#2e2209;
}
</style>
