Frage stellen
ich habe ein dreispaltiges DIV, indem ich Inhalte (images) mittig ausrichten möchte. Bei einer Tabelle wäre das problemlos machbar, bei einem DIV ist das vertikale ausrichten etwas schwieriger!?
Ich habe im Web eine Lösung zur mittigen Ausrichtung von Inhalten in einem DIV gefunden: jakpsatweb.cz (Both vertical and horizontal centering)
Meine eigenen dreispaltigen DIV's sehen wie folgt aus:
- Code: Alles auswählen
<div style="width: 600px;">
<div style="width:200px; height: 140px; float:left;">
Inhalt Links
</div>
<div style="width:200px; height: 140px; float:left;">
Inhalt Mitte
</div>
<div style="width:200px; height: 140px; float:left;">
Inhalt Rechts
</div>
<div style="clear:both;"></div>
</div>
Ich habe die gefunde Lösung von jakpsatweb.cz für mich mit einem einzigen DIV umsetzen können, es funktioniert wie gewünscht:
- Code: Alles auswählen
<style type="text/css">
#outer {width: 140px; height: 120px; overflow: hidden; position: relative; border: 1px solid #dadade;}
#outer[id] {display: table; position: static;}
#middle {position: absolute; top: 50%; width: 140px; text-align: center;} /* for explorer only*/
#middle[id] {display: table-cell; vertical-align: middle; position: static;}
#inner {position: relative; top: -50%; text-align: center;} /* for explorer only */
#inner {width: 140px; margin: 0 auto; } /* for all browsers*/
#inner[id] {position: static;}
</style>
<div id="outer">
<div id="middle">
<div id="inner">
<img src="layout/image.gif" alt="" border="0" width="150" height="80" />
</div>
</div>
</div>
Leider bekomme ich es aber nicht hin, diese "Lösung" auf die einzelnen DIV's meiner drei o.a. Spalten zu übertragen.
Lässt sich die mittige Ausrichtung von #middle u. #inner auf meine dreispaltigen DIV's übertragen???
