My webpage works fine in google chrome but when I open it in internet explorer there is a few div boxes which always ends up differently than it does on google chrome.
I align them perfectly in chrome so the end of the box's lines meet at the bottom so you can see they are straight with a ruler then when i open it in IE the right box appears to have moved down by about 10px i have no idea how to fix this as it doesn't move down in chrome.
Here's how I align them:
.left_top {
margin-top:-93%;
margin-left:1.8%;
background-image:url('/images/top.jpg');
background-repeat: repeat-y;
height:28px;
width:500px;
}
.right_top {
margin-left:560px;
margin-top:-341px;
margin-bottom:auto;
background-image:url('/images/top.jpg');
background-repeat: repeat-y;
height:28px;
width:500px;
}
.content_left {
margin-left:1.8%;
padding-left:5px;
padding-right:4px;
padding-top:5px;
width:491px;
height:300px;
background-color:#e7f2e5;
}
.content_right {
padding-left:5px;
padding-top:5px;
padding-right:4px;
width: 491px;
height: 300px;
margin-left:560px;
background-color:#e7f2e5;
}
.left_bottom {
margin-left:1.8%;
background-image:url('/images/bottom.jpg');
background-repeat: repeat-y;
height:8px;
width:500px;
}
.right_bottom {
height:8px;
width: 500px;
margin-left:560px;
background-image:url('/images/bottom.jpg');
}Suggestions please... or alternate ways of aligning that box?
PLEASE HELP!