tutorials.de Buch-Aktion 05/2012
Like Tree1Danke
  • 1 Beitrag von threadi
ERLEDIGT
JA
ANTWORTEN
3
ZUGRIFFE
539
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 13.10.11 19:10 #1
    SteffiS SteffiS ist offline Grünschnabel
    Registriert seit
    Oct 2011
    Beiträge
    2
    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.

    HTML-Code:
    <!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 :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

    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!
     
    Zitieren Zitieren
  2. 13.10.11 20:00 #2
    threadi threadi ist offline Mitglied Brokat
    Registriert seit
    Dec 2006
    Ort
    Leipzig
    Beiträge
    478
    Ergänze in deiner CSS-Datei ganz oben

    Code :
    1

    * { margin: 0;padding: 0; }

    Dadurch werden alle Innen- und Außenabstände zurückgesetzt. Dann sollten auch diese Abstände weg sein.
    SteffiS bedankt sich. 
    Zitieren Zitieren
  3. 14.10.11 13:02 #3
    SteffiS SteffiS ist offline Grünschnabel
    Registriert seit
    Oct 2011
    Beiträge
    2
    Super vielen dank, hat perfekt geklappt!
     
    Zitieren Zitieren
  4. 14.10.11 13:04 #4
    Avatar von sheel
    sheel sheel ist offline Moderator
    tutorials.de Moderator
    Registriert seit
    Jul 2007
    Beiträge
    4.501
    Dann markier dien Thema das nächste Mal bitte als Erledigt.

    Noch ein Tipp um Forum: Es gibt auch [css]...[/css]
     
    Netiquette (vA §15) und Nutzungsregeln (vA §4.8) einhalten! Programmcode in Codetags/Codeboxen.
    Sehr gute Beiträge bitte Bewerten (Stern darunter oder "Danke").
    "Funktioniert nicht" ist zu ungenau! Code, Fehlermeldungen, Verhalten des Programms, ...?
    Zitieren Zitieren
« Problem mit -webkit-transform und -webkit-transition | CSS-Neuling braucht Hilfe »

Ähnliche Themen

  1. Footer über ganze Seitenbreite - Content zentriert mit fixer Breite
    Von Goshy im Forum CSS
    Antworten: 6
    Letzter Beitrag: 17.07.11, 16:22
  2. Links über ganze Breite verteilen?
    Von Layna im Forum CSS
    Antworten: 6
    Letzter Beitrag: 22.01.08, 13:19
  3. MySQL geht nicht über 99
    Von PHP-Fan im Forum Relationale Datenbanksysteme
    Antworten: 3
    Letzter Beitrag: 13.12.06, 11:02
  4. MySQL geht nicht über 99
    Von PHP-Fan im Forum PHP
    Antworten: 2
    Letzter Beitrag: 13.12.06, 10:33
  5. border geht nicht um das ganze Formular-DIV
    Von scrotum im Forum CSS
    Antworten: 3
    Letzter Beitrag: 10.03.06, 17:55