Why does IE 7 not handle, the css background property for anchors?
css:
.nav a
{
float: left;
display: block;
padding: 5px;
height: 25px;
line-height: 25px;
font-weight: bold;
}
.nav a:hover
{
background: #fff;
color: #000;
}
html:
<div class="nav">
<a href="#">anchor</a>
</div>
It has no background, but only in ie7. Why?
What color is the surrounding background? If it's also white, then this won't work in any browser.
If page color is non-white, it's worth trying the solution recommended in this blog post: http://www.bernzilla.com/item.php?id=762: ading a DOCTYPE to your page to force IE7 into standards-compliant mode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
If that doesn't work, other solutions I've seen include:
display:block style on the linkYou need to make sure you are using a strict doctype to get hover working in IE7:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">