• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Css Menu line-height

S

Secret

Neues Mitglied
Hallo.

Ich versuche grade ein Menu zu erstellen und habe ich es fixiert bekommen, inclusive einer automatischen breiten anpassung. Nun wollte ich die einzelnen li-Menupunkte(außer des Logo), etwas nach oben heben. Allerdings möchte es nicht mit line-height funktionieren.

Sieht ihr das Problem vielleicht?

HTML: 
<!doctype html>
    <div class="fixed">
    <ul class="menu">
    <li id="logo"><a href="#">
    <img src="media/images/logo.png" alt="Logo" title="Logo" />
    </a></li>
    <li><a href="#">Menupu</a></li>
    <li><a href="#">Menupu</a></li>
    <li><a href="#">Menupu</a></li>
    <li><a href="#">Menupu</a></li>
    <li><a href="#">Menupu</a></li>
    <li><a href="#">Menupu</a></li>
    <li><a href="#">Menupu</a></li>
    </ul>
    </div>

Code: 
@charset "UTF-8";
@font-face {
  font-family: Montserrat;
  font-size: 13px;
  local: Montserrat;
  src:url(../fonts/Montserrat-Regular.ttf);
}

html {
    background-color: #282828;
}

body {
    font-family: Montserrat, Verdana, Geneva, sans-serif;
    color: #fff;
    margin: auto;
    min-width: 768px;
    width: 100%;
    background-color: #000;
}

a {
    text-decoration: none;
}

ul, li {
    list-style-type: none;
}

.fixed {
    position: fixed;
    min-width: 768px;
}

.menu {
    min-width: 750px;
    width: 90%;
    margin: 10px 15%;
    font-size: 85%;
    z-index: 99;
}

.menu li {
    display: inline;
    padding: 0 1.1%;
}


.menu li a{
    color: #fff;
    line-height: 400%;
}

Danke Euch!
 
Hi,

steht im Quelltext wirklich

HTML: 
<!doctype html>
    <div class="fixed">

? Wenn ja, öffne erstmal html-, head- und body-Tags ^^

Die Links in li kannst du in dem Fall mit margin-top und margin-bottom positionieren...
 
Hallo.

Danke dir, schon mal.

Der HTML Code ist nur ein Ausschnitt. Soweit ich sehe habe ich auch keine li mit Margin beeinflusst. Ich wollte lediglich die li etwas weiter nach oben bringen. Sonst habe ich das immer mit line-height gemacht.

Aber das funktioniert hier nicht, weißt du eine Lösung?
 
Ich habe mal ein wenig rumprobiert, allerdings hat sich das Ganze nur bei

Code: 
ul.menu {
    min-width: 750px;
    width: 90%;
    margin: 10px 15%;
    font-size: 85%;
    z-index: 99;
    margin-top: -5px;
}

verschoben. Das Problem ist, dass sich die gesamte Leiste verschiebt und nicht nur die Links... Anstatt "5" geht natürlich auch jede andere Zahl.
 
ObeyTheSyntax schrieb:
Ich habe mal ein wenig rumprobiert, allerdings hat sich das Ganze nur bei

Code: 
ul.menu {
    min-width: 750px;
    width: 90%;
    margin: 10px 15%;
    font-size: 85%;
    z-index: 99;
    margin-top: -5px;
}

verschoben. Das Problem ist, dass sich die gesamte Leiste verschiebt und nicht nur die Links... Anstatt "5" geht natürlich auch jede andere Zahl.
Zum Vergrößern anklicken....

Das Gesamte Menu konnte schon die ganze Zeit bewegen.

Danke nochmal, ich löse das anderes. Ich programmiere schon einpaar Jahre, du schätzt mich etwas falsch ein. Ich schick dir in einer Woche gerne das Ergebnis.

Kann geschlossen werden!
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben