Let me start by saying I am new to CSS and not good at it yet. So feel free to tell me if there is a better way to do this.
I have two CSS problems.
1. I'm trying to put a background in the center of the browser window at the top, and stay there when the user resizes their browser.
Problem, IE7 puts the image all the way to the right. FF the left. If I center this then how do I keep the below images in place with this as well when the browser is resized?
2. I have 6 images in their own containers across the top and text in their own containers on top of them. Right now they are fixed. I would like the above background, and these images/text to stay in place when the browser is resized.
CSS for background so far:
div.imageholder{
background: url(../images/bg_winetiles.jpg);
position:absolute;
margin:0px auto;
}
CSS for nav images and text, there are six of these, i'm only posting one set:
div.navImage1{
position:absolute;
width: 115px;
height: 103px;
left : 76px;
top: 16px;
z-index: 3;
line-height:30px;
font-size: 18px;
color:#FFFFFF;
}
div.navText1{
position:absolute;
width: 115px;
height: 59px;
left : 76px;
margin:0px auto;
top: 40px;
z-index: 4;
line-height:30px;
font-size: 18px;
color:#FFFFFF;
I have two CSS problems.
1. I'm trying to put a background in the center of the browser window at the top, and stay there when the user resizes their browser.
Problem, IE7 puts the image all the way to the right. FF the left. If I center this then how do I keep the below images in place with this as well when the browser is resized?
2. I have 6 images in their own containers across the top and text in their own containers on top of them. Right now they are fixed. I would like the above background, and these images/text to stay in place when the browser is resized.
CSS for background so far:
div.imageholder{
background: url(../images/bg_winetiles.jpg);
position:absolute;
margin:0px auto;
}
CSS for nav images and text, there are six of these, i'm only posting one set:
div.navImage1{
position:absolute;
width: 115px;
height: 103px;
left : 76px;
top: 16px;
z-index: 3;
line-height:30px;
font-size: 18px;
color:#FFFFFF;
}
div.navText1{
position:absolute;
width: 115px;
height: 59px;
left : 76px;
margin:0px auto;
top: 40px;
z-index: 4;
line-height:30px;
font-size: 18px;
color:#FFFFFF;