Gunther: Problem mit Faux columns

Beitrag lesen

Hallo!

Die Grundstruktur ist einfach:

<div style="display: table">

<div style="display: table-cell"></div>
  <div style="display: table-cell"></div>
  <div style="display: table-cell"></div>
  <!-- … -->
</div>


>   
> Da findet kein Umbruch statt, wenn ich die Seite kleiner mache...  
  
Von alleine sicher nicht.  
Du musst Media Queries nutzen und dann bspw. bei geringerer Viewportbreite statt 'display: table-cell' dann 'display: table-row' verwenden.  
  
Übrigens müsstest du eigentlich ein Fan hiervon sein. Denn anders als bei der Float-Variante, kann hier tatsächlich die Container-Elemente im HTML Code weglassen. Diese fügt der Browser nämlich dann selbständig als anonyme Boxen ein.  
  
Nachteil: Du kannst diese nicht per CSS selektieren und somit auch nicht formatieren.  
  
  
Gruß Gunther