mehrere divs nebeneinander und zentriert

[Richy]

Einen wunderschönen guten Morgen :)
Ich suche nach einer Möglichkeit eine variable Anzahl von divs innerhalb eines parent divs zu zentrieren sodass aber so viele Elemente wie mögilch nebeneinander platziert werden. Ich habs geschafft die Elemente zu zentrieren indem ich margin:auto gesetzt hab jedoch werden sie dann untereinander angezeigt. Wenn ich float:left hinzufüge erreich ich den gewünschten Effekt dass sie nebeneinander sind und wenn ich den Browser verkleinere werden die divs die keinen Platzt mehr haben in die nächste Reihe gestellt so wie es sein soll. Leider ist das ganze dann wieder linksbündig.
Ich hätte auch schon an Tabellen gedacht, jedoch ist ja die Anzahl der angezeigten elemente (und damit auch der Spalten und Reihen) variabel und muss sich auch beim Verändern der Browsergröße mit verändern.
Ich hoffe ihr könnt mir da weiter helfen.
Danke MfG Richy

[Beat]

Ich suche nach einer Möglichkeit eine variable Anzahl von divs innerhalb eines parent divs zu zentrieren sodass aber so viele Elemente wie mögilch nebeneinander platziert werden. ...

<div class=container>  
  <div>some content</div>  
  ...  
</div>  

.container  
    { text-align:center; }  
.container div  
    { display:inline; /* für MSIE */  
      display:inline-block;  
      width:10em;}  

mfg Beat

[richy]

Cool danke. Genau das hab ich gesucht.
MfG Richy

[suit]

.container div
    { display:inline; /* für MSIE */
      display:inline-block;
      width:10em;}

Ich dachte, inline-block funtkioniert im IE6 und 7 nur, wenn die Default-Display-Eigenschaft bereits inline ist:

"In IE 6 and 7 inline-block works only on elements that have a natural display: inline."

[Beat]

.container div
    { display:inline; /* für MSIE */
      display:inline-block;
      width:10em;}

Ich dachte, inline-block funtkioniert im IE6 und 7 nur, wenn die Default-Display-Eigenschaft bereits inline ist:

"In IE 6 and 7 inline-block works only on elements that have a natural display: inline."

Ja. Aber nichts hindert MSIE daran, die Elemente mit display:inline darzustellen.

mfg Beat

[ChrisB]

Hi,

.container div
    { display:inline; /* für MSIE */
      display:inline-block;
      width:10em;}

Ich dachte, inline-block funtkioniert im IE6 und 7 nur, wenn die Default-Display-Eigenschaft bereits inline ist:

"In IE 6 and 7 inline-block works only on elements that have a natural display: inline."

Wofür das inline m.W. in einer separaten, vorhergehenden Regel notiert sein muss.

Ja. Aber nichts hindert MSIE daran, die Elemente mit display:inline darzustellen.

Daran, dafür auch die width-Angabe umzusetzen, sollte ihn aber der standards compliant mode hindern.

MfG ChrisB

[Beat]

.container div
    { display:inline; /* für MSIE */
      display:inline-block;
      width:10em;}

Ich dachte, inline-block funtkioniert im IE6 und 7 nur, wenn die Default-Display-Eigenschaft bereits inline ist:

"In IE 6 and 7 inline-block works only on elements that have a natural display: inline."

OK etwas ausführlicher:
.container
    { text-align:center; background:red; }
.container div
    { display:inline; /* catch a Bug in old Operas */
      display:inline-block;
      width:10em; background:white;}
#msie7 .container div
    { display:inline; /* für MSIE7 mit CC-ID*/}

Grund für das vorangestellte display:inline ist streng genommen ein Opera Bug in einer älteren 9.x Version

mfg Beat