Forum Moderators: not2easy
All areas bar the centrebox are a dark blue.
All seems to be going fine but I can't figure the best way to have a 1px horizontal line between the leftbox and the mainbox that will extend to the length of either the browser window or the centrebox (whichever is longer).
I tried setting a blue background image with a 1px horizontal line on the right hand side to repeat in the leftbox but this simply didn't show up at all?
#leftbox {
position: absolute;
top: 123px;
left: 0px;
width: 160px;
background-image: url(pattern1.gif);
background-repeat: repeat-y;
font-size: 14px;
padding-top: 10px;
margin: 2px;
}
I tried adding in the picture height but that didn't make any difference either.
So then I tried setting a right border to the leftbox but this only goes down as far as the content in the leftbox (which will be a fixed menu system):
#leftbox {
position: absolute;
top: 123px;
left: 0px;
width: 158px;
border-right: 1px solid #CCCCFF;
font-size: 14px;
padding-top: 10px;
margin: 2px;
}
In case it's tied up with my centrebox the CSS for that is as follows:
#centrebox {
margin: 0 182px 0 160px;
padding: 10px;
background: #FFFFFF;
color: #000088;
font-family : Batang, Verdana, Eyechart, Geneva, Arial, Helvetica, sans-serif;
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
Any help or pointers greatfully appreciated - I'm sure it's a basic error!
TIA
Beau
Went out for an hour and realised I needed to put the repeating image in the body rather than in a div box.
BODY {
background-color : #282C6C;
font-family : Batang, Verdana, Geneva, Arial, Helvetica, sans-serif;
background-image: url(pattern1.gif);
background-repeat: repeat-y;
color : #000088;
margin: 0px;
}
Although if anyone has any better ways of doing this please