img in li vertikal ausrichten
_fabi
- css
Hallo,
es geht um folgendes Projekt:
www.dr-orth.de/relaunch
Ich würde gerne die Kreise rechts neben den Navigationspunkten ausrichten, scheiterte jedoch immer. Die Punkte sollen mittig neben den Navigationspunkten sein. Wenn die Navigationspunkte über mehrere Zeilen gehen bleiben die Kreise jedoch immer oben und beim hover-Effekt sind sie unten.
Hat vielleicht jemand einen Rat für mich?
Gruß
_fabi
Hi,
Ich würde gerne die Kreise rechts neben den Navigationspunkten ausrichten, scheiterte jedoch immer. Die Punkte sollen mittig neben den Navigationspunkten sein. Wenn die Navigationspunkte über mehrere Zeilen gehen bleiben die Kreise jedoch immer oben und beim hover-Effekt sind sie unten.
Hat vielleicht jemand einen Rat für mich?
Binde die Kreise nicht als IMG-Elemente ein - sie sind kein Inhalt, sondern Verzierung. Nutze also Hintergrundbilder.
Sorge dafür, dass die Menüpunkte bis über die Linie gehen - dann kannst du die Kreise ganz einfach als Hintergrundbild der Menüpunkte einblenden, und dabei auch oben-, mittig- oder untenbündig mit dem jeweiligen Element ausrichten.
MfG ChrisB
Hallo ChrisB,
Binde die Kreise nicht als IMG-Elemente ein - sie sind kein Inhalt, sondern Verzierung. Nutze also Hintergrundbilder.
Sorge dafür, dass die Menüpunkte bis über die Linie gehen - dann kannst du die Kreise ganz einfach als Hintergrundbild der Menüpunkte einblenden, und dabei auch oben-, mittig- oder untenbündig mit dem jeweiligen Element ausrichten.
ich hatte die Kreise anfangs als Hintergrundbild, doch dann muss ich den Menüpunkten ein padding-right geben. Wenn die Mehrspaltigemenüpunkte ein padding-right haben stimmt die unterste Zeile, doch die oberen Zeilen sind weiter nach rechts gerückt. Das ist also auch keine Lösung für das Problem.
Gruß
_fabi
@@_fabi:
nuqneH
ich hatte die Kreise anfangs als Hintergrundbild, doch dann muss ich den Menüpunkten ein padding-right geben. Wenn die Mehrspaltigemenüpunkte ein padding-right haben stimmt die unterste Zeile, doch die oberen Zeilen sind weiter nach rechts gerückt. Das ist also auch keine Lösung für das Problem.
Doch, das ist die Lösung. Gib noch 'div#navigation ul li a {display: block}
', passt schon.
Warum ist der Selektor eigentlich so ausschweifend? 'div#navigation a
' sollte doch genügen, oder?
Qapla'
@@_fabi:
nuqneH
es geht um folgendes Projekt:
www.dr-orth.de/relaunch
Verlinke die Seite! (Geht auch mit dem „Link“-Button über dem Eingabefeld.)
Hat vielleicht jemand einen Rat für mich?
Ja, noch einen zusätzlichen: „Verlinke niemals auf die aktuelle Seite.“ (Punkt 10 der zehn meist-missachteten Homepage-Design-Richtlinien [Nielsen])
Qapla'