bsmith
Oct-13-2009, 06:45 PM
Good evening everyone...i've been trying to customize my site but turns out it looks like i am making a mess of it. I tried floating my nav bar above my banner using the relative positioning and z-index in css. I got the nav to be located where i want it, but when i tried moving the remainder of my div elements up the page, i couldn't quite figure it out. Would someone mind helping me move these div elements up the page ensuring that the "stretchy" factor remains intact? thanks,
b
http://www.wrimages.smugmug.com
#my_Banner {
width: 919px;
height:178px;
margin: 0 auto;
background: url(http://wrimages.smugmug.com/photos/674571578_Cm5DJ-O.png) no-repeat;
}
#navContainer ul {
margin: 0;
margin-bottom: 120px;
margin-left: 500px;
position: relative;
z-index: 8;
padding: 0 50px;
list-style-type: none;
text-align: center;
}
#navContainer ul li {
display: inline;
}
#navContainer ul li a {
font-size: 18px;
font-family: Georgia;
text-decoration: none;
padding: .2em .3em;
border-right: 2px solid #262626;
color: #7c4141;
}
#navContainer ul li a:hover {
color: #bbbb00;
}
#navContainer .navCurrentPage:visited {color: #bbbb00 !important;}
#underline {
width: 787px;
height:8px;
margin: 0;
margin-bottom: 120px;
position: relative;
z-index: 9;
background: url(http://wrimages.smugmug.com/photos/678849608_RrMqn-O.png) no-repeat;
}
#splashImage {
width: 976px;
height:465px;
display: none;
margin: 0 auto;
border: 4px solid #262626;
background: url(http://wrimages.smugmug.com/photos/679148911_QJbsA-O-1.jpg) no-repeat;
}
b
http://www.wrimages.smugmug.com
#my_Banner {
width: 919px;
height:178px;
margin: 0 auto;
background: url(http://wrimages.smugmug.com/photos/674571578_Cm5DJ-O.png) no-repeat;
}
#navContainer ul {
margin: 0;
margin-bottom: 120px;
margin-left: 500px;
position: relative;
z-index: 8;
padding: 0 50px;
list-style-type: none;
text-align: center;
}
#navContainer ul li {
display: inline;
}
#navContainer ul li a {
font-size: 18px;
font-family: Georgia;
text-decoration: none;
padding: .2em .3em;
border-right: 2px solid #262626;
color: #7c4141;
}
#navContainer ul li a:hover {
color: #bbbb00;
}
#navContainer .navCurrentPage:visited {color: #bbbb00 !important;}
#underline {
width: 787px;
height:8px;
margin: 0;
margin-bottom: 120px;
position: relative;
z-index: 9;
background: url(http://wrimages.smugmug.com/photos/678849608_RrMqn-O.png) no-repeat;
}
#splashImage {
width: 976px;
height:465px;
display: none;
margin: 0 auto;
border: 4px solid #262626;
background: url(http://wrimages.smugmug.com/photos/679148911_QJbsA-O-1.jpg) no-repeat;
}