Hallo,
ich bin gerade noch in der Anfangsphase mit html und css lernen und habe direkt schon relativ am Anfang ein Problem. Und zwar soll meine Navigationsleiste über die ganze Bildschirmbreite gehen. Allerdings, obwohl ich die breite des div containers auf 100% gestellt habe ist an der rechten und linken Seite ein kleine Lücke. Außerdem kommt unten kein scrollbalken wenn man das Fenster verkleinert, wahrscheinlich weil die breite 100% ist und er die navileiste dann einfach verkleinert. Ich habe auch schon probiert der Leiste eine feste Größe von 1024px zu geben, aber ich denke mir mal das klappt nur so lange, wie die Auflösung auf dieser Stufe ist, wenn ein anderer jetzt mit einer höheren Auflösung auf die Seite geht wird beim ihm die Leiste wohl nicht über die komplette Breite gehen. Komisch ist auch das die Leiste nicht ganz links anfängt obwohl ich auch float:left eingestellt habe. Am besten ich poste einfach mal den Code und ihr fragt dann, wenn ihr etwas nicht versteht.
und das div.header soll über die ganze breite gehen!
ich bin gerade noch in der Anfangsphase mit html und css lernen und habe direkt schon relativ am Anfang ein Problem. Und zwar soll meine Navigationsleiste über die ganze Bildschirmbreite gehen. Allerdings, obwohl ich die breite des div containers auf 100% gestellt habe ist an der rechten und linken Seite ein kleine Lücke. Außerdem kommt unten kein scrollbalken wenn man das Fenster verkleinert, wahrscheinlich weil die breite 100% ist und er die navileiste dann einfach verkleinert. Ich habe auch schon probiert der Leiste eine feste Größe von 1024px zu geben, aber ich denke mir mal das klappt nur so lange, wie die Auflösung auf dieser Stufe ist, wenn ein anderer jetzt mit einer höheren Auflösung auf die Seite geht wird beim ihm die Leiste wohl nicht über die komplette Breite gehen. Komisch ist auch das die Leiste nicht ganz links anfängt obwohl ich auch float:left eingestellt habe. Am besten ich poste einfach mal den Code und ihr fragt dann, wenn ihr etwas nicht versteht.
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<link href="style.css" type="text/css" rel="stylesheet" />
<link rel="SHORTCUT ICON" href="http://www.....org/bilder/logo.ico"/>
<title>....org | ......</title>
</head>
<body>
<div>
<ul>
<li><a class="standard" href="....htm">Test</a></li>
<li><a class="standard" href="....htm">Test</a></li>
<li><a class="standard" href="....htm">Test</a></li>
<li><a class="standard" href="....htm">Test</a></li>
</ul>
</div>
<div class="header">
<div class="logo"><a href="/" onfocus="if(this.blur)this.blur()"><img src="bilder/Logo.jpg" alt="....org - ..." title="....org – ..."/></a></div>
<div class="navi">
<ul>
<li class=""><a class="groß" href="http://www....org/index.htm" title=" ......">Test</a></li><li class=""><a class="groß" href="http://www......htm" title="...." >Test</a></li>
</ul>
</div>
</div>
</body>
</html>
Code:
div.navi {
margin-top:65px;
}
div.logo {
float: left;
margin-right: 10px;
}
div.header {
background-image:url("bilder/Header.jpg");
margin-left: 0px;
margin-top: 2px;
margin-bottom: 10px;
width: 100% !important;
height: 100px;
float:left;
}
li{
display: inline;
margin-left:0px;
}
ul {
margin-left:0px;
display: inline;
font-size:10px;
}
und das div.header soll über die ganze breite gehen!