• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

IE9 Problem mit float + vertical-align in table

ska3k

Neues Mitglied
Hallo,
das Problem ist folgendes: Ich habe eine Tabelle die die Eigenschaft float=left besitzt, die Texte in der table sollen mittig ausgerichtet werden in vertikaler Richtung, wobei float allerdings den vertical-algin verhindert? Gibt es ein Workaround?

Ist wieder mal nur ein Bugfix für den IE, in allen anderen Browsern ist zwischen den tables kein Zwischenraum, mit float=left hatte ich diesen im IE entfernt.

Hier ein Codeausschnitt:

Code:
<table width="100%" border="0" cellpadding="0" cellspacing="0"> 
<tr ><td><a href="#" class="mainlevel" >CE</a></td></tr> 
<tr ><td><a href="#" class="mainlevel" >Berechnung</a></td></tr> 
<tr ><td><a href="#" class="mainlevel" >Erstellung</a></td></tr>
 </table>

Code:
#menu-content td {
    vertical-align: middle;
    height: 32px;
    background: url(../images/menu-back.PNG) repeat-x;
}

#menu-content td:hover, #menu-content td:active {
    background: url(../images/menu-hover.PNG) repeat-x;
}
  
#menu-content td a {   
    float: left;
    clear: left;
    /*position: relative;
    top: 50%;*/
    background: none;
}  

#menu-content .mainlevel {
    background: none;
}

#menu-content a:hover, #menu-content a:active, #active_menu {
    background: none;
}

Wenn ich /*position: relative; top: 50%;*/ einkommentiere ist es schon fast mittig. Problem dabei ist, wenn die a-tags über 2 Zeilen gehen, es nicht mehr ganz in der Mitte ist. Den hover habe ich in der normalen css auch in den a-tags untergebracht, hier in den td's, damit diese nicht mit verschoben werden im IE9.

Ohne float wird alles super zertriert, nur dann haben die Zellen der Tabelle ein margin-bottom von ein paar Pixel.

Vielen Dank für eure Hilfe!

Grüße,
ska3k
 
float wegzulassen wäre die Lösung. Das dann nach unten Abstand entsteht kann ich so nicht erkennen. Hast Du alle Abstände genullt?

Code:
* { margin: 0;padding: 0; }
 
Ohne float verschiebt er wie gesagt die Elemente um n-Pixel. Das mit padding, margin hab ich schon versucht. Evtl. sollte ich auf ul-li umsteigen.
 
Zurück
Oben