Floating Bug im IE7.

IE der HölleYay! Und schon wieder ein Bug im Internet Explorer! Dieses Mal in Version 7! Ich habe das Gefühl, meist noch einmal 150% der Zeit darauf zu verwenden, um Bugs im Internet Explorer zu „fixen“, bzw. um Workarounds zu finden.. IE6 schau ich mir kaum noch an… Dieser gehört langsam aber sicher ausgerottet!

Nach dem Mini-Rant aber nun zum Problem: Listenelemente nebeneinander anzeigen:

So soll es aussehen:
Bildschirmfoto 2013-08-14 um 20.14.52

So sieht es aus:

Bildschirmfoto 2013-08-14 um 20.14.26

Hier dazu das CSS (stark vereinfacht):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
ul{
position: absolute;
margin: 0;
text-align: center;
}
ul li{
display:inline-block;
list-style: none;
width: 15px;
height: 15px;
padding: 0;
margin: 0;
margin-left: 3px;
margin-right: 3px;
}

Der Fix sieht wie folgt aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
[...]
ul li{
display:inline-block;
zoom: 1;
*display: inline;
list-style: none;
width: 15px;
height: 15px;
padding: 0;
margin: 0;
margin-left: 3px;
margin-right: 3px;
}

Das Asterisk (*) vor display: inline wird von anderen Browsern ignoriert.

Ich habe die Befürchtung, dass mich diese Ausgeburt der Hölle noch einige graue Haare kosten wird…

Quelle

Friedemann

Friedemann ist Masterstudent im letzten Semester an der FH Kiel, Embedded Devices Enthusiast und Fullstack Webentwickler. Schlechter Blogger: schreibt viel zu selten.

Share

2 Responses

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Post comment

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.