Home/ Questions/Q 6024465
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T04:09:32+00:00

I’ve been looking at the css code for quite a while and have tried

  • 0

I’ve been looking at the css code for quite a while and have tried many times to get this page: http://appraisalline.com/chicagoappraisals/ to render correctly in IE but to no avail. The css code I’m trying to solve for is this:

nav {
padding: 0px 0px 3px 0px;
width: 100%;
height: 50px;
overflow: hidden;
}

nav ul {
background: url(../images/nav-li-bg.gif) right top no-repeat;
height: 50px;
overflow: hidden;
float: left;
}

nav ul  li {
font-size: 13px;
line-height: 24px;
float: left;
background: url(../images/nav-li-bg.gif) 0 0 no-repeat;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
margin-left: -2px;
}

nav ul li a {
color: #fff;
text-decoration: none;
display: inline-block;
cursor: pointer;
text-transform: uppercase;
position: relative;
font-weight: bold;
margin: 0 0px 0 0;
}

nav ul li a span {
background: none;
display: inline-block;
padding: 0px 6px 0 6px;
}

nav ul li a span span {
background: none;
padding: 13px 17px 13px 16px;
}

nav ul li a:hover, nav .active {
background:url(../images/nav-left.gif) left top no-repeat;
color:#fff;
}

nav ul li a:hover span, nav .active span {
background:url(../images/nav-right.gif) right top no-repeat;
}

nav ul li a:hover span span, nav .active span span {
background:url(../images/nav-tail.gif) 0 0 repeat-x;
}

nav .first {margin: 0;}

Any and all help for why this is not rendering is appreciated. Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You’re trying to style HTML5 elements (in this case the nav element) that versions of IE before IE9 don’t understand. Use an html5 shim if you feel you have to style those elements:

    http://code.google.com/p/html5shim/

    A better solution in the short term, in my view, is not to style the new elements directly, but rather style other elements and just use the HTML5 elements for semantic structure. What the shim is doing is creating the elements using javascript which then allows css rules to be applied to them in browsers that don’t understand the elements.

    • 0