Forums

CSS

This topic is locked

Disjointed Layout

Posted 09 Aug 2006 00:36:49
1
has voted
09 Aug 2006 00:36:49 Richard Wood posted:
When viewing www.brunelrugby.co.uk in anything other than IE the bottom gray bar appears disjointed and smaller than specified in the css. I have include the css for the entire page below. Any help would be appreciated.

Rich

#greybar is the name of the div im worried about.

body {
background-image: url(Images/images/backTile.gif);
}
a {
font-size: 12px;
color: #CCCCCC;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #FFFFFF;
}
a:active {
text-decoration: none;
}

#Layer2 {
position:absolute;
left:0px;
top:0px;
width:100%;
height:60px;
z-index:1;
background-color: #999999;
}
#greyBar {
position:absolute;
width:100%;
height:18px;
z-index:1;
left:0px;
top:554px;
background-color: #999999;
}
#firstRowOne {
position:absolute;
left:0px;
top:0px;
width:161px;
height:60px;
z-index:2;
background-color: #DBD9D9;
}
#Layer3 {
position:absolute;
left:161px;
top:0px;
width:479px;
height:60px;
z-index:3;
background-color: #CCCCCC;
}
#Layer4 {
position:absolute;
left:640px;
top:0px;
width:160px;
height:60px;
z-index:4;
background-color: #B2B2B2;
}
#Layer5 {
position:absolute;
left:161px;
top:60px;
width:479px;
height:50px;
z-index:1;
background-color: #DBD9D9;
}
#Layer6 {
position:absolute;
left:640px;
top:60px;
width:161px;
height:50px;
z-index:1;
background-color: #662D2D;
}
#Layer7 {
position:absolute;
left:0px;
top:110px;
width:161px;
height:224px;
z-index:1;
background-color: #662D2D;
line-height:60%;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
overflow: hidden;
}
#Layer8 {
position:absolute;
left:161px;
top:110px;
width:479px;
height:224px;
z-index:2;
}
#Layer9 {
position:absolute;
left:640px;
top:110px;
width:161px;
height:224px;
z-index:3;
background-image: url(Images/images/webLayout_09.gif);
}
#newsBox {
position:absolute;
left:161px;
top:334px;
width:162px;
height:173px;
z-index:5;
background-color: #DBD9D9;
}
#Layer10 {
position:absolute;
left:327px;
top:367px;
width:156px;
height:173px;
z-index:6;
}
#Layer11 {
position:absolute;
left:322px;
top:334px;
width:162px;
height:173px;
z-index:6;
background-color: #DBD9D9;
}
#Layer12 {
position:absolute;
left:484px;
top:334px;
width:156px;
height:173px;
z-index:7;
background-color: #DBD9D9;
}
#Layer13 {
position:absolute;
left:640px;
top:334px;
width:161px;
height:220px;
z-index:8;
background-color: #662D2D;
}
#Layer14 {
position:absolute;
left:161px;
top:507px;
width:479px;
height:47px;
z-index:9;
background-color: #CCCCCC;
}
.style1 {color: #666666}
#Layer15 {
position:absolute;
left:642px;
top:643px;
width:161px;
height:100%;
z-index:1;
background-color: #662D2D;
}
#Layer16 {
position:absolute;
left:640px;
top:154px;
width:157px;
height:100%;
}
#Layer17 {
position:absolute;
left:640px;
top:614px;
width:161px;
height:300;
z-index:10;
background-color: #662D2D;
}
.style10 {color: #666666; font-size: 14px; }
#Layer18 {
position:absolute;
left:0px;
top:582px;
width:802px;
height:60px;
z-index:10;
background-color: #662D2D;
}
.style11 {font-size: 12px}
.style12 {
color: #333333;
font-weight: bold;
}
-->


body {
background-image: url(Images/images/backTile.gif);
}
a {
font-size: 12px;
color: #CCCCCC;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #FFFFFF;
}
a:active {
text-decoration: none;
}

#Layer2 {
position:absolute;
left:0px;
top:0px;
width:100%;
height:60px;
z-index:1;
background-color: #999999;
}
#greyBar {
position:absolute;
width:100%;
height:18px;
z-index:1;
left: 0px;
top: 554px;
background-color: #999999;
}
#firstRowOne {
position:absolute;
left:0px;
top:0px;
width:161px;
height:60px;
z-index:2;
background-color: #DBD9D9;
}
#Layer3 {
position:absolute;
left:161px;
top:0px;
width:479px;
height:60px;
z-index:3;
background-color: #CCCCCC;
}
#Layer4 {
position:absolute;
left:640px;
top:0px;
width:160px;
height:60px;
z-index:4;
background-color: #B2B2B2;
}
#Layer5 {
position:absolute;
left:161px;
top:60px;
width:479px;
height:50px;
z-index:1;
background-color: #DBD9D9;
}
#Layer6 {
position:absolute;
left:640px;
top:60px;
width:161px;
height:50px;
z-index:1;
background-color: #662D2D;
}
#Layer7 {
position:absolute;
left:0px;
top:110px;
width:161px;
height:224px;
z-index:1;
background-color: #662D2D;
line-height:60%;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
overflow: hidden;
}
#Layer8 {
position:absolute;
left:161px;
top:110px;
width:479px;
height:224px;
z-index:2;
}
#Layer9 {
position:absolute;
left:640px;
top:110px;
width:161px;
height:224px;
z-index:3;
background-image: url(Images/images/webLayout_09.gif);
}
#newsBox {
position:absolute;
left:161px;
top:334px;
width:162px;
height:173px;
z-index:5;
background-color: #DBD9D9;
}
#Layer10 {
position:absolute;
left:327px;
top:367px;
width:156px;
height:173px;
z-index:6;
}
#Layer11 {
position:absolute;
left:322px;
top:334px;
width:162px;
height:173px;
z-index:6;
background-color: #DBD9D9;
}
#Layer12 {
position:absolute;
left:484px;
top:334px;
width:156px;
height:173px;
z-index:7;
background-color: #DBD9D9;
}
#Layer13 {
position:absolute;
left:640px;
top:334px;
width:161px;
height:220px;
z-index:8;
background-color: #662D2D;
}
#Layer14 {
position:absolute;
left:161px;
top:507px;
width:479px;
height:47px;
z-index:9;
background-color: #CCCCCC;
}
.style1 {color: #666666}
#Layer15 {
position:absolute;
left:642px;
top:643px;
width:161px;
height:100%;
z-index:1;
background-color: #662D2D;
}
#Layer16 {
position:absolute;
left:640px;
top:154px;
width:157px;
height:100%;
}
#Layer17 {
position:absolute;
left:640px;
top:614px;
width:161px;
height:300;
z-index:10;
background-color: #662D2D;
}
.style10 {color: #666666; font-size: 14px; }
#Layer18 {
position:absolute;
left:0px;
top:582px;
width:802px;
height:60px;
z-index:10;
background-color: #662D2D;
}
.style11 {font-size: 12px}
.style12 {
color: #333333;
font-weight: bold;
}
-->
<font color=red></font id=red><font color=black></font id=black>

Reply to this topic