[GELÖST] Liste <ul> zentriert ausrichten

brandy · 05. Oktober 2013 19:04

Hallo!

Ich habe eine Liste, die mit float: left ausgerichtet ist, und so mein horizontales Menü bildet.
Jetzt möchte ich dieses in einem DIV, das keine fixe Größe hat, zentrieren.

Hier das dazugehörige CSS:

Hier klicken, um den Code zum Kopieren zu markieren

.top_menu{
list-style-type: none;
}

.top_menu li{
float: left;
margin-right: 20px;
font-family: chopin;
font-size: x-large;
}

top_menu ist die Klasse des <ul>.

Vielen Dank für Hilfe!

Janl · 06. Oktober 2013 09:52

Versuche es mit

margin: 0 auto;

bei .top_menu li

mfg
Jan

brandy · 06. Oktober 2013 15:02

Danke für den Tipp - hat aber nichts gebracht - rutscht einfach nicht rüber :-)

NaN · 06. Oktober 2013 15:48

Nicht den Listenpunkten (li) sondern den Links in den Listenpunkten (li a) musst Du margin:auto geben. Aber ohne den Code oder die Seite zu sehen, können wir da echt nur Vermutungen anstellen.

mike-r · 06. Oktober 2013 17:49

Das wird so nicht funktionieren, da durch das floaten die Listenpunkte aus der Liste "rausfallen" und Du somit eine Breite definieren _musst_.
Da Du diese Breite aber nicht wissen*, bzw. nur schätzen kannst, solltest Du besser inline-block statt float verwenden.
Ein Beispiel:
http://jsfiddle.net/T8rF2/

* es sei denn man frickelt sich das umständlich per JS aus dem Dokument raus

brandy · 06. Oktober 2013 20:38

Ich habs jetzt anderweitig gelöst - ich hab das DIV, das das ul beinhaltet mit dem CSS-Framework zentriert ausgerichtet!

Danke...

mike-r · 06. Oktober 2013 20:44

Kann man das mal sehen? Ein Framework kann auch nicht zaubern, recht sicher hast Du eine Breite vergeben.

brandy · 07. Oktober 2013 15:55

Nein, hab ich nicht...

Beitrag geändert von brandy (08. Oktober 2013 22:13)

Janl · 07. Oktober 2013 17:18

Validier mal dein HTML und CSS.

http://validator.w3.org/check?uri=http% … ne&group=0

http://jigsaw.w3.org/css-validator/vali … g=&lang=de

mfg
Jan

brandy · 07. Oktober 2013 21:25

Ja, was rätst du da?
Ich setz mir grundsätzlich nur das CMSms auf, baue Foundation mitein und beginne dann mit dem Design...

Janl · 07. Oktober 2013 21:35

Validieren ist Kode anpassen an W3C Standards.

Das kennst Du doch auch oder?
Vielleicht mal mit Foundation Entwickelrn mailen.

mfg
Jan

brandy · 08. Oktober 2013 22:08

Ok, interessant, soviele Fehler hab ich nur hier auf dieser einen Seite von mir (die auch noch nicht fertiggestellt ist). Auf anderen Seite, die schon länger produktiv laufen hab ich nur 2-3 Fehler...

Danke aber für den Tipp...

Beitrag geändert von brandy (08. Oktober 2013 22:11)

mike-r · 08. Oktober 2013 00:19

brandy schrieb:

Nein, hab ich nicht...

Hier klicken, um den Code zum Kopieren zu markieren

max-width:62.5em

ist eine "feste" Breite. Wenn da mehr (oder modifizierte) Punkte hinzukommen, wird das Menü umbrechen. Das ist jetzt schon am Limit, 2-3 Buchstaben dazu und das Menülayout kann man in die Tonne tun.
Verstehe sowieso nicht, warum der - frei in Weiss schwebende Header - in der Breite begrenzt werden muss.

Was das Validieren betrifft; bei so starker ujnd weitgehend planloser Containerverschachtelung kein Wunder, dass da Fehler auftreten. Recht spassig in so unübersichtlichem Spaghetticode auftretenden Probleme zu lösen ... ach war ja eh Topic; hab nix gesagt.

Forum für CMS/made simple

#1 05. Oktober 2013 19:04

[GELÖST] Liste <ul> zentriert ausrichten

#2 06. Oktober 2013 09:52

Re: [GELÖST] Liste <ul> zentriert ausrichten

#3 06. Oktober 2013 15:02

Re: [GELÖST] Liste <ul> zentriert ausrichten

#4 06. Oktober 2013 15:48

Re: [GELÖST] Liste <ul> zentriert ausrichten

#5 06. Oktober 2013 17:49

Re: [GELÖST] Liste <ul> zentriert ausrichten

#6 06. Oktober 2013 20:38

Re: [GELÖST] Liste <ul> zentriert ausrichten

#7 06. Oktober 2013 20:44

Re: [GELÖST] Liste <ul> zentriert ausrichten

#8 07. Oktober 2013 15:55

Re: [GELÖST] Liste <ul> zentriert ausrichten

#9 07. Oktober 2013 17:18

Re: [GELÖST] Liste <ul> zentriert ausrichten

#10 07. Oktober 2013 21:25

Re: [GELÖST] Liste <ul> zentriert ausrichten

#11 07. Oktober 2013 21:35

Re: [GELÖST] Liste <ul> zentriert ausrichten

#12 08. Oktober 2013 22:08

Re: [GELÖST] Liste <ul> zentriert ausrichten

#13 08. Oktober 2013 00:19

Re: [GELÖST] Liste <ul> zentriert ausrichten

Fußzeile des Forums