Hi all,
For the following website: http://www.beijinggatewayacademy.com,
I have a very strange problem concerning the div called aswrapper.
In I.E 6, the background-color extends further down than desired, making it look very bad.
In 7, it is as I intended it to be.
In 8 (as well as Chrome), there is a gap (the size of the background-color in I.E 6).
Does anyone have an idea? Thanks for looking into it, I have absolutely no idea where to start here.
Page:
Code:
<center>
<DIV id="aswrapper"><br />
<DIV id="asleft"><br />
</div><br />
<DIV id="asright"><br />
</div><br />
<DIV id="astext"><br />
Here you can <a href="http://www.beijinggatewayacademy.com/content/ask-question-0">ask us</a> a question or <a href="http://www.beijinggatewayacademy.com/content/bga-application-form">apply today</a>.<br />
<DIV id="asart"><br />
</div><br />
</div><br />
</div></center>
</div>
CSS:
Code:
#aswrapper
{
bottom:10px;
z-index:2;
position:relative;
width: 90%;
height:150px;
background: url(../images/blue/bg.jpg) 0 0 repeat;
padding:0px;
margin: 0px;
}
#astext a, #astext a:hover
{
color:#1b1713;
text-decoration:underline
}
#asleft
{
z-index:3;
width: 6px;
height:150px;
float:left;
position:relative;
background: url(../images/blue/left.jpg);
margin:0px;
bottom:18px;
}
#asright
{
z-index:3;
width: 6px;
height:150px;
float:right;
position:relative;
background: url(../images/blue/right.jpg);
margin:0px;
bottom:36px;
}
#asart
{
z-index:4;
width: 176px;
height:170px;
float:right;
position:relative;
background: url(../images/blue/mapbg.png);
margin:0px;
left:40px;
bottom:85px;
}
#astext
{
color:#1b1713;
z-index:5;
position:relative;
}
|
