...

View Full Version : CSS position attribute question



CarlMartin10
07-06-2010, 12:33 AM
if you look at my site in Firefox, and in IE, there is a button that I used position: absolute; on that is in the RIGHT PLACE in Firefox, but not in IE. I know that I should use position: relative; , but I can not seem to get it to work right. When I do that, my nav menu is pushed down. I am not that good with the positioning. Please advise, thanks.

The portion of code that is the button is #header. purchase


/** BEGIN header **/
#header {
height: 178px;
}
#header .search {
float: right;
margin-top: 11px;
}
#header .search form {
background: url(../images/search.png) no-repeat 0 0;
height: 49px;
width: 284px;
}
#header .search form input {
float: right;
background-color: transparent;
border: 0;
font-size: 0.8em;
color: #FFFFFF;
height: 38px;
width: 223px;
margin-top: 5px;
text-transform: uppercase;
}
#header .search form button {
float: left;
width: 59px;
height: 49px;
background-color: transparent;
border: 0;
color: transparent;
text-indent: -9999px;

}


#header .subscribe {
position: relative;
top: 75px;
left: 635px;
float: left;
text-align: center;
color: #ffffff;

}

#header .purchase {
position: absolute;
top: 149px;
right: 512px;



}

#header .logo {
clear: both;
}
#header .logo h1 {
padding-bottom: 32px;
}
#header .logo h1 a {
position: relative;
bottom: 15px;
background: url(../images/logo.png) no-repeat 0 0;
display: block;
text-indent: -9999px;
height: 62px;
width: 352px;
}


#header ul {
list-style-type: none;

}
#header ul li {
float: left;
margin-right: 15px;
}
#header ul li a {
padding: 5px 8px;
color: #FFFFFF;
text-transform: uppercase;
text-decoration: none;
font-size: 0.9em;
font-weight: bold;
}
#header ul li a:hover {
background-color: #b9c3cf;
}
/** END header **/

CarlMartin10
07-06-2010, 07:42 AM
This has been resolved

_Aerospace_Eng_
07-06-2010, 08:35 AM
Just as an FYI, when you make something position:relative; and change its left, right, bottom, or top values, it still occupies the space that it was originally in. Right now I'm seeing a horizontal scrollbar on your page. My resolution is 1280x800.

CarlMartin10
07-06-2010, 08:57 AM
noted, thanks



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum