Zentrieren mehrere floating DIVs in einem umgebenden DIV

[Bart]

Hallo,

ich habe mehrere DIVs, die ich per float:left nebeneinander positioniere. Diese sind in ihrer Summe aber nicht so breit wie das umgebende DIV. Wie zentriere ich diesen "Block" von DIVs im umgebenden DIV?

Habt vielen Dank :-)

[viplex]

Hast du feste oder flexible breiten?

[sejuma]

Entweder nochmal in einen kleineren Div packen und diesen zentrieren, oder abhängig von der Gesamtbreite dem ersten gefloateten Div einen margin-left-Wert geben.

[Bart]

Entweder nochmal in einen kleineren Div packen und diesen zentrieren, oder abhängig von der Gesamtbreite dem ersten gefloateten Div einen margin-left-Wert geben.

Na alles nochmal in ein DIV zu packen bringt ja nichts, weil dieses DIV dann ja wieder die volle Breite einnimmt und somit nicht zentriert werden kann.

Ja, eigentlich kenne ich die vielen Einzelbreiten der gefloateten DIVs ... aber schön wäre eine Lösung, wo ich bei deren Änderung oder der Änderung der Breite des umgebenden DIVs nicht jedesmal zu Rechnen anfangen müsste und alle Werte von Hand anpassen müsste.

Mein Code sieht vereinfacht derzeit so aus:

<div id="umgebend">
<a href="" style="float:left; display:block; width:2em;">text1</a>
<a href="" style="float:left; display:block; width:2em;">text2</a>
<a href="" style="float:left; display:block; width:2em;">text3</a>
<div style="clear:both;"></div>
</div>

Ich könnte die floating-DIVs mit einer Tabelle umgeben und diese nimmt ja dann schön dynamisch die richtige Breite an und lässt sich wunderbar zentrieren. Aber das widerspricht ja dem Mantra, man solle Tabelle wirklich nur noch für echte Tabellen und nicht mehr für Layouts nehmen ... oder wäre das dann hier ein Beispiel, wo dieses schöne aber hinderliche Mantra versagt?

[sejuma]

Offensichtlich handelt es sich um eine Navi, die du besser in Listenform machen solltest.
Außerdem dürfen für a die Styleangaben nicht im HTML-Code, sondern in der CSS-Datei oder als Styleangaben innerhalb des Headbereichs enthalten sein.

Ich denke, dass du damit dein Problem lösen kannst: http://www.ohne-css.gehts-gar.net/0063.php