Disc nach links von Listenelement wird unten

Screenshot angezeigt, was geschieht:Disc nach links von Listenelement wird unten

Screen shot 2010-07-27 at 3.37.23 PM.png

Es ist nur ein Listenelement in einer underordered Liste, dies in IE7 geschieht, und nirgendwo anders.

<ul> 
    <li>Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text.</li> 
</ul> 

.fancybox-entry.computer-policy li { 
    float:none; 
    width:100%; 
    list-style-type:disc; 
    margin-bottom:10px; 
} 

.fancybox-entry.computer-policy ul + p { 
    margin-bottom:20px; 
} 

.fancybox-entry.computer-policy ul { 
    margin:5px 0 10px 25px; 
}

Jede Hilfe, warum es das tut und eine Lösung wird geschätzt.

Quelle

2010-07-27 Brad

Ich sehe nichts falsch! oder vielleicht habe ich einfach nicht verstanden, was du machen willst. –

Das Problem besteht darin, dass die Aufzählungszeichen auf den Listenelementen am vertikalen Ende der Zeile im Gegensatz zu dem oberen angezeigt werden. –

Ich hatte ein ähnliches Problem mit Kugeln, aber die Antwort dieser Frage hat mir nicht geholfen. Siehe meine Frage für die Details: http://stackoverflow.com/questions/6735404/listitem-disc-displaying-at-vertical-bottom –

Es scheint, dass die Breite CSS-Eigenschaft löst hasLayout für das li Element in IE7. Versuchen Sie zunächst, die width:100%;-Deklaration zu entfernen, um sicherzustellen, dass das Bullet an der richtigen Stelle angezeigt wird. Wenn Sie nicht auf die Eigenschaft width verzichten können, können Sie position: relative; und vertical-align: top; verwenden, um die Kugel wieder an ihren Platz zu bringen, wie unter http://www.gunlaug.no/tos/moa_26.html beschrieben.

Beachten Sie, dass der Code auf dieser Seite Hacks verwendet IE6 und IE7 Ziel. Ich empfehle, mit bedingten Kommentare statt, etwa so:

<!--[if IE 7]> 
    <style type="text/css" media="screen"> 
    /* IE7-specific CSS here */ 
    </style> 
<![endif]-->

Quelle

2010-07-27 20:08:10 peterjmag

+1 guten Ruf auf der hasLayout, es ist ein kniffliges Problem zu fangen, wenn Sie nicht tun wissen, was es verursacht – derekerdmann

Mein Ruf Kommentar noch zu niedrig ist, sonst würde ich diese Antwort ist zu peterjmag hinzugefügt haben. (Vielleicht kann er es enthält ...)

Die Breite Eigenschaft der Täter ist, aber ich würde eine andere Änderung vorschlagen. Um sicherzustellen, dass Ihre Listenelemente in IE7 volle Breite einnehmen, verwenden Sie stattdessen "width: auto". Dies wird Ihnen das gleiche Aussehen geben und Ihre Aufzählungspunkte werden ihren richtigen Platz einnehmen. Ich habe festgestellt, dass "vertical-align: top/text-top" die Aufzählungszeichen nur ein wenig nördlich von wo ich möchte, drückt.

Wenn Sie nicht an Bedingungen geknüpft Klassen oder ein IE Sheet verfügen, verwenden Sie einfach „* width: auto“ IE7 Ziel.

Quelle

2013-12-18 16:12:49 Jeff

Disc nach links von Listenelement wird unten

Antwort

Verwandte Themen