Hallo, ich bin gerade dabei mich mit html zu beschäftigen und habe ein kleines Problem unzwar habe ich ein navigationsmenü mithilfe einer liste erstellt und mit float angeordnet, so weit, so gut. Jetzt habe ich ein Bild(title.gif) wenn ich einbibnde wird es ebenfalls von der float funktion eingebunden ich hab zwar clear: both; vversucht, es hilft aber nix.
Das ist die Seite: BJC-Buchen
HTMl
CSS:
Das ist die Seite: BJC-Buchen
HTMl
HTML:
<html>
<head>
<title>BJC-Buchen</title>
<link rel="stylesheet" type="Text/css" href="style.css">
</head>
<body>
<ul id="list-nav">
<li><a href="#">Home</a></li>
<li><a href="#">Kontakt</a></li>
<li><a href="#">Suche</a></li>
<li id="Impressum"><a href="#">Impressum</a></li>
</ul>
<img src="title.gif" id="title">
<img src="Menubar.png" id="menubar">
<center><img src="Streifen.png" id="steifen.png"></center>
</body>
</html>
Code:
body {
background-color: 76EE00;
margin:0;
padding:0;
font: bold 11px/1.5em Verdana;
}
/*----------------------------------------------------------------*/
img#streifen {
width: 700px;
height: 100%;
padding-top: 100px;
}
img#title {
clear:both;
heihgt: 88px;
width: 513;
align: left;
}
img#menubar {
width: 90%;
height: 140px;
padding-top: 10px;
padding-bottom: 30px;
}
/*----------------------------------------------------------------*/
ul#list-nav {
list-style:none;
padding-left: 5px;
padding-top: 20px;
width:525px
}
ul#list-nav li {
display:inline
}
ul#list-nav li a {
text-decoration:none;
width:100px;
background:#76EE00;
color:black;
float:left;
text-align:center;
border-left:1px solid black;
}
ul#list-nav li#impressum a {
border-right: 1px solid black;
widht: 100px;
height: 17px;
}
ul#list-nav li a:hover {
background:#C0FF3E;
color:black
}
/*---------------------------------------------------------------*/