j cop
Erfahrenes Mitglied
Hallo,
bei dem Layout, das ich gerade schreibe, taucht nun ein Problem auf. Es funktioniert in FF und Opera einwandfrei, und jetzt habe ich es im IE(7 Beta) getestet. Die Navigationleiste verschwindet, wenn ich das :hover mit Attributen versehe.(In dem Fall andere Hintergrundfarbe)
Woran kann das liegen?
-->Link<--
bei dem Layout, das ich gerade schreibe, taucht nun ein Problem auf. Es funktioniert in FF und Opera einwandfrei, und jetzt habe ich es im IE(7 Beta) getestet. Die Navigationleiste verschwindet, wenn ich das :hover mit Attributen versehe.(In dem Fall andere Hintergrundfarbe)
Woran kann das liegen?
-->Link<--
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<link type="text/css" href="#" rel="stylesheet" media="screen" />
<style>
* {
margin:0;
padding:0;
}
body {
background:#555;
margin:0;
padding:0;
}
#header {
background:url('header.png');
height:136px;
width:550px;
margin:0 auto;
}
#footer {
background:url('footer.png');
height:29px;
width:550px;
margin:0 auto;
}
#main {
background:url('main.png');
width:520px;
margin:0 auto;
padding:15px 15px;
}
#navbar {
margin:0px auto;
width:550px;
margin-top:-25px;
height:23px
}
#navbar ul {
list-style:none;
margin-left:13px;
}
#navbar ul li {
display:inline;
}
#navbar ul li a {
padding:2px 15px 4px 15px;
background:#6699ff;
margin:0px 1px;
text-decoration:none;
}
#navbar ul li a:hover, #navbar ul li a#active {
background:#fff;
}
img {
border:1px solid #000;
}
a {
text-decoration:none;
}
a:hover {
text-decoration:underline;
}
</style>
</head>
<body>
<div id="header"></div>
<div id="navbar">
<ul>
<li><a href="#" id="active">Home</a></li>
<li><a href="#">Archiv</a></li>
<li><a href="#">Bilder</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Kontakt</a></li>
</ul>
</div>
<div id="main">
<p>Cras fringilla dui nec eros. Fusce consequat. Curabitur feugiat fermentum justo. Morbi aliquam mauris id tortor fermentum volutpat.
Suspendisse leo elit, mattis eget, hendrerit a, placerat a, sapien. Vestibulum ullamcorper purus eu urna. Proin sodales justo nec purus.
Aenean vel tellus eu ligula placerat scelerisque. Nulla rutrum. Sed sit amet diam. Quisque convallis eleifend purus. Fusce magna turpis,
adipiscing in, hendrerit a, dignissim eu, lacus. In in arcu. Aliquam ac neque id nisi rhoncus molestie. Aenean aliquet feugiat mauris.
Sed tristique vestibulum tortor. Morbi risus. Aenean tempus eleifend elit. </p>
</div>
<div id="footer"></div>
</body>
</html>
