HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Ich habe auf einer ASP.NET Seite eine horizontale Navigation (ul - Liste) welche ich zentrieren möchte.

Hier die Seite: [URL="http://www.mitsubishi-carisma.de/carisma.aspx?page=carisma"]Carisma - Misubishi Carisma[/URL]

Gemeint ist die Navigation: 2001 | 2002 | 2003 usw.

Diese ist per CSS erstellt und wird dynamisch aus einer Datenbank aufgebaut.

Ich möchte nun, dass diese eben zentriert und nicht wie aktuell linksbündig erscheint, weiß aber beim besten nicht wie ich das anstellen soll, da die Breite der Liste eben unbekannt ist und sich erst durch die Anzahl der Listeneinträge ergibt.

Bisher gefundene Beispiele gehen leider immer davon aus, dass die Breite fest vorgegeben ist - was bei mir eben leider nicht der Fall ist.

Kann mir da vielleicht jemand auf die Sprünge helfen?

PS: Das ganze soll natürlich W3C konform sein. Aktuell verwende ich: XHTML 1.0 Transitional

MfG Exit

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Hi,
normalerweise würde ich die Seite und die div's mal analysieren, aber da du Ahnung hast geb' ich mal nur den Hinweis, dass ein div mit

[B] margin: auto auto;[/B]

zentriert werden kann (das erste auto für vertikal, das zweite horizontal). Daher könnte es bei dir style="margin: 0 auto;" heißen.

Sag mal bescheid, obs geklappt hat.
Gruß

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Habe es noch nicht probiert - aber das funktioniert meines Wissens eben nur, wenn man die Breite des DIV (UL) Containers vorher weiß und fest definiert.

Aber ich werde es heute abend mal probieren.

PS: Grad noch gesehen - mit dem IE6 zeigt er auch noch Müll bei der Navigation an - das muss ich ihm auch noch abgewöhnen.

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Wie schon befürchtet - das ganze funktioniert leider nur, wenn der Container selbst auch eine vordefinierte Breite hat - entspricht also nicht dem reinen "text-align" - welches ja leider nur auf text und nicht auch div & co wirkt.

Habe es erstmal mit ner festen Breite versehen - damit es brauchbar aussieht.

Falls trotzdem noch einer mal ne Idee hat - dann nur her damit.

Vielen Dank trotzdem

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

:?:
Ich habe genau das gleiche Problem.
Und ich finde diese Frage sehr oft in verschiedenen Foren und nirgends gibts eine tatsächliche Antwort.

Ist denn dieses Problem nicht lösbar ?
Wie kann man die beschriebene Anforderung umsetzen ??
Weiß das keiner ?
geht das nicht ?
können das die viel gepriesenen Divs nicht?

zu [I]Table-zeiten[/I] war diese Frage überhaupt kein Thema !!

lg aus Wien
[URL="http://www.lookover.at"][COLOR=black]www.lookover.at[/COLOR][/URL]

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

[quote=Lookover;729685]:?:

können das die viel gepriesenen Divs nicht?

zu [I]Table-zeiten[/I] war diese Frage überhaupt kein Thema !!

[/quote]

Eigentlich sollte es mit Divs klappen, jedoch wird manchmal noch ein zusätzlicher Container mit Eigenschaften benötigt. Die Situation bessert sich aber sowieso schon etwas mit der Zeit, da der Explorer 6 zunehmend weniger genutzt wird und nicht unbedingt optimal bedient werden muß.

Neuere Browser bieten umfangreichere CSS-Möglichkeiten wie z.B. [I]display:inline-block;[/I] oder [I]display:table;[/I].

Mehr zum Thema Zentrieren: [URL]http://pernox.de/2009/04/zentrieren-per-css.html[/URL]

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Für die horizontale Zentrierung mit CSS, kam mir des öfteren dieses simple "Template" zur Hilfe -> [URL="http://bluerobot.com/web/css/center1.html"]http://bluerobot.com/web/css/center1.html[/URL].

display:inline-block wird meines Wissens im IE nicht erkannt und CSS expressions funktionieren auch nur dann wenn sich der IE im [url=http://de.wikipedia.org/wiki/Quirks-Modus]Quirks-Modus[/url] befindet.

Optional könnte man die Elemente beim Laden mit JS nachträglich zentrieren obwohl das wohl eher die russiche Variante ist.

lg

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Hallo,...

Also ich habe nun alle für mich relevanten Anforderungen dieses Thema betreffend relativ cool gelöst und auf dieser Seite zusammengefasst:

[URL="http://example.kk-bits.com/Pages/dynamischeDivsho_lz.php"]dynamische Divs horizontal zentrieren[/URL]

Da ist wie ich meine recht übersichtlich inklusive kompakten Beispielen die Thematik aus meiner Sicht erklärt.

Ich hoffe es bringt jemanden was.

lg aus Wien
[URL="http://www.lookover.at"]www.lookover.at[/URL]

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

wtf iss ja von 2008 :D

aber ich bin ja nicht der einzigste der der 3 jahre später antwortet^^

[quote]
<center>
<ul>
<li>2001</li>
<li>2002</li>
</ul>
</center>
[/quote]

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Fehlt da nicht noch die inline definition für die li's? Außerdem sind center tags ja mittlerweile sowas von veraltet (html4 standard). Grade wenn man die Seite mal auf html5 "upgraden" will..

[quote]
The <center> Tag. Not Supported in HTML5.
Definition and Usage

The <center> tag is not supported in HTML5. Use CSS instead.

The <center> tag was used to center align text and content.
[/quote]

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

aber es funktioniert und ist nicht so aufwendig, jeder wie er will...

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

[quote=magr;738998]aber es funktioniert[/quote]
nope, je nach DocType und Browser eben nicht ;)
und <center> ist wirklich eher 90er

Positionierung lässt sich leicht per CSS bewerkstelligen.
Folgendes Tutorial sollte eigentlich alle Fragen klären:

[url=http://haslayout.net/css-tuts/Horizontal-Centering]Horizontal Centering - CSS Tutorials - hasLayout.net by Zoffix Znet[/url]

Lg

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Mit CSS lässt sich doch alles leicht zentrieren.
Die gute alte Anweisung die auch in allen Browsern läuft ist margin: 0 auto;

AW: HTML/CSS UL/DIV Element dynamischer Breite zentrieren?
 

Hm - nimms mir nicht übel, aber der Thread ist so kurz, da kann man den wirklich noch überfliegen.

"margin: 0 auto; " funktioniert leider nur mit festen Breiten! Des bedeutet, man muss vorher definieren (wissen), wie breit das zu zentrierende Element ist.

Das wollte ich ja damals vermeiden, da eben Jahr um Jahr dazu kommen. Aber da man das auch nur einmal im Jahr macht, kann man den optimalen Wert ja auch festlegen. Wenn es dynamisch aus ner DB gekommen wäre, hätte ich wohl (Jahre * Elementbreite) zur Berechnung verwendet.