Forums

blueturtle

Hi! I hope that someone can help me with this issue.
Someone just pointed out that there is a problem with the top navigation of one of my sites in I.E. 8.0. The site has been live for about a week. Here is the link:

http://www.firstalarmteam.com

As you will see, the button "Contact" is dropped down one line from the rest of the top navigation buttons. So far, I.E. 8.0 is the only browser having this issue as I checked it out in I.E. 7, Firefox and Safari. I've looked at my code and can't figure what the problem would be since I used an unordered list for the nav and all list items should display the same (shouldn't they?). Any help would be awesome!

Here is my css


/*
960px grid system ~ Core CSS.
12 Columns ~ Margin left: 10px ~ Margin right: 10px

Based on the 960.gs grid system - http://960.gs/

Created by the Grid System Generator - v1.02
Learn more ~ http://www.gridsystemgenerator.com/
*/

/* =Containers
--------------------------------------------------------------------------------*/
.container_12
{
	width: 960px;
	margin: 0 auto;
}

/* =Grid >> Global
--------------------------------------------------------------------------------*/
.grid_4, .grid_6, .grid_7, .grid_8, .grid_12 {
	display: inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}

/* =Grid >> Children (Alpha ~ First, Omega ~ Last)
--------------------------------------------------------------------------------*/
.alpha {margin-left: 0;}
.omega {margin-right: 0;}

/* =Grid >> 12 Columns
--------------------------------------------------------------------------------*/
.container_12 .grid_4 {width: 300px;}
.container_12 .grid_6 {width: 460px;}
.container_12 .grid_7 {width: 540px;}
.container_12 .grid_8 {
	width: 620px;
}
.container_12 .grid_12 {
	width: 940px;
}


/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
/* http://sonspring.com/journal/clearing-floats */
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
.clearfix:after {
	clear: both;
	content:' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}
#logo {
	width: 420px;
	float: left;
	margin-top: -65px;
	clear: both;
}
#logonav_header {
	width: 940px;
	float: left;
	display: inline;
	margin: 0 10px;
	height: 97px;
}
#mainimage {
	margin-bottom: 10px;
}
#mainbody {
	background-color: #FFFFFF;
	margin: 0 10px 0 10px;
	height: 320px;
	padding-right: 20px;
}
#maintext {
	float: left;
	width: 620px;
	display: inline;
}
#topedge {
	background-image: url(images/rounded_top.png);
	background-repeat: no-repeat;
	height: 16px;
	margin: 0 auto;
	width: 940px;
}
#bottomedge {
	background-image: url(images/rounded_bottom.png);
	background-repeat: no-repeat;
	margin: 0 auto;
	height: 18px;
	width: 940px;
}
#topnav {
	margin-left: 485px;
	margin-top: 0px;
	clear: both;
	display: block;
}
#topnav ul {
	display: inline;
	list-style-type: none;
	width: 450px;
}
#topnav li {
	display: inline;
}
#topnav a {
	display: block;
	float: left;
	width: 90px;
	text-decoration: none;
	text-align: center;
	height: 31px;
	color: #FFFFFF;
	padding-top: 38px;
}
#topnav a.activehome {
	background-image: url(images/topnav_active.png);
	background-repeat: no-repeat;
	background-position: 6px 0;
}
#topnav a.activehome:hover {
	background-image: url(images/topnav_active.png);
	background-repeat: no-repeat;
	background-position: 6px 0;
}
#topnav  a:hover {
	background-image: url(images/topnav_button.png);
	background-repeat: no-repeat;
	background-position: 6px 0;
}
#footer {
	width: 910px;
	padding: 0 15px;
	background-color: #FFFFFF;
	float: left;
	display: inline;
}
#sidebar {
	float: left;
	width: 288px;
	display: inline;
	margin-left: 12px;
	text-align: left;
}
#securetips {
	width: 230px;
	padding: 0 10px;
	border-right: solid #d20d0d 1px;
	margin-left: 1px;
}
#securetips ul {
	display: inline;
	margin-left: 12px;
}
#securetips li {
	height: 50px;
	margin-bottom: 13px;
	font-size: 13px;
	list-style-image: url(images/redbullet.png);
	line-height: 16px;
	margin-left: 15px;
}
#homeproducts {
	width: 230px;
	padding: 0 10px;
	border-right: solid #d20d0d 1px;
	margin-left: 1em;
}
#homeproducts ul {
	display: inline;
	margin-left: 12px;
}
#homeproducts li {
	height: 20px;
	margin-bottom: 13px;
	font-size: 13px;
	list-style-image: url(images/redbullet.png);
	line-height: 16px;
	margin-left: 15px;
}
#copyright {
	margin: 0 auto;
	width: 940px;
	text-align: center;
}
#maintext ul {
}
#maintext li {
	font-size: 13px;
	line-height: 20px;
}
.fltrt {
	float: right;
	padding-right: 20px;
}
.fltlft {
	float: left;
}
#mainbody_products {
	background-color: #FFFFFF;
	margin: 0 10px 0 10px;
	height: 420px;
}
#products {
	float: left;
	width: 620px;
	display: inline;
}
#products ul {
	list-style-type: none;
	margin-left: -23px;
}
#products li {
	font-size: 13px;
	height: 45px;
	line-height: 17px;
}
#contactinfo {
	width: 230px;
	padding: 0 10px;
	border-right: solid #d20d0d 1px;
	margin-left: 1px;
}
#mainbody_contact {
	background-color: #FFFFFF;
	margin: 0 10px 0 10px;
	height: 765px;
}
#mainbody_thanks {
	background-color: #FFFFFF;
	margin: 0 10px 0 10px;
	height: 250px;
}
#mainbody_about {
	background-color: #FFFFFF;
	margin: 0 10px 0 10px;
	height: 350px;
}
#slideshow {
	margin-bottom: 10px;
	width: 940px;
	height: 220px;
	overflow: hidden;
	position: relative;
}
#slideshow img {
	position: absolute;
	left: 0px;
	top: 0px;
}
#brands {
	text-align: center;
}
#brands img {
	border: 0;
	margin-bottom: 15px;
}

@charset \"UTF-8\";
h1 {
	font-size: 30px;
	text-indent: -9999px;
	background-image: url(images/fa_logo.png);
	background-repeat: no-repeat;
	height: 47px;
}
h2 {
	font-size: 24px;
	font-weight: normal;
}
h3 {
	font-size: 18px;
	color: #d20d2d;
	font-weight: normal;
}
.container_12 p {
	font-size: 13px;
	line-height: 20px;
}
.copyright {
	font-size: 11px;
	text-align: center;
	color: #FFFFFF;
}
.securitytips {
	text-indent: -9999px;
	background-image: url(images/securitytips.png);
	background-repeat: no-repeat;
	height: 24px;
}
a:link {
	color: #333;
	text-decoration: underline;
}
a:visited {
	text-decoration: underline;
	color: #000000;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: underline;
	outline:none;
}
.address {
	font-size: 12px;
	color: #666666;
	text-align: center;
	padding-top: 15px;
}
.products_h3 {
	text-indent: -9999px;
	background-image: url(images/products_h3.png);
	background-repeat: no-repeat;
	height: 24px;
}
.producthead {
	color: #d20d0d;
	font-size: 14px;
}
.contactinfo {
	font-size: 13px;
	line-height: 19px;
}
.contactform {
	font-size: 13px;
	color: #999999;
}
.required {
	color: #d20d0d;
}
.topbrands_h3 {
	text-transform: uppercase;
	color: #d20d0d;
	text-align: center;
}

treehouse : what would you like to learn today?

Forums

Navigation issue - I.E. 8.0