Tag-Archiv: fallback

 

Mehrspaltige Texte mit IE Fallback

Mehrspaltige Texte sind in Print-Medien, insbesondere Zeitungen und Zeitschriften, Gang und Gäbe, aber im Web ließen sie sich bislang nur auf umständliche Art und Weise realisieren.

Mittlerweile kann man aber auch in einem ganz normalen HTML-Element dafür sorgen, dass ein Text mehrspaltig dargestellt wird. So kann man z.B. einen Text im folgenden Beispiel-Div-Element mehrspaltig realisieren.

<div class="columns">
	Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ...
</div>

Dank CSS3 funktioniert das in modernen Browsern, wie z.B. Mozilla Firefox, Google Chrome oder Opera, ohne größere Probleme. Teilweise ist dafür aber leider noch der jeweilige Präfix (-moz, -webkit usw.) nötig:

/* multi columns */			
.columns {
	width: 100%;
	-moz-column-count: 3;
	-moz-column-gap: 20px;
	-webkit-column-count: 3;
	-webkit-column-gap: 20px;
	column-count: 3;
	column-gap: 20px;
}

Mozilla Firefox 14.0

Aber leider funktioniert diese Variante noch nicht in allen Browsern.

— Weiterlesen —