Layout anpassen HTML 5 CSS 3

[Basti15517]

Hallo ich hänge seit einigen stunden ans anpassen des Navigationstextes fest

wie bekomme ich die texte in gleichen abständen ausgerichtet den so sieht es
etwas unsymmetrisch aus


Codeschnipsel

/* ****************** Navigation ******************************************* 
***********************************************************************/

#navigation-oben .menu{
    margin-top:47px;
    margin-left:369px;
    list-style-type: none;
    width: 580px;
    
}

#navigation-oben .menu li a{
    

    width: 115px;
    height: 32px;
    display: block;
    float:left;
    
    font-family: 'Oswald' , Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    line-height:32px;
    text-align:center;
    color:#fff;
    text-decoration:none;
}

#navigation-oben .menu li a:hover{
    font-size:14px;
    font-weight:300;
    text-decoration: underline;
    
}

 

[Cheffchen]

Hallo,

sieht so aus wie sagt in #navigation-oben .menu li a{ mit width: 115px;
mach einfach ein min-width: 80px; draus und füge ein padding:0 10px; mit ein.

Cheffchen

 

[threadi]

Lass die Angabe "width: 115px;" mal weg und versuche mit padding die Abstände nach links und rechts zu regeln.

Moderation: Verschoben von HTML zu CSS, da es um Gestaltung geht.

 

[eistruhe]

Wenn die Abstände sich auf die Breite des Textes beziehen sollen, dann benutzt du padding rechts und links.
Dann hat jedes Textelement den gleichen Abstand, sie sind aber unterschiedlich breit.

Wenn du aber möchtest, dass alle Textelemente die gleiche Breite haben, dann würde ich den <li>'s eine feste Breite geben, und text-align: center; – so sind alle gleich Breit, und der Text ist im Element zentriert.

Allerdings ist die erste Methode die schönere :)