Режим совместимости IE 9 с ul против float: left - PullRequest
3 голосов
/ 14 апреля 2011

Список ul с плавающей точкой: left вызывает у меня серьезную головную боль в IE 9. Он хорошо работал в IE 7 и IE 8, а теперь нет.Я пытался изменить тип документа безрезультатно.Если я оставлю doctype вне его, он будет работать нормально ..... но это не тот путь.

Следующий пример поместит маркеры над желтой областью в IE 9. Любые указатели вообще?

enter image description here

Вот мой код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
body{
background-color:grey;
}
.somewrapper{
width:500px;
background-color:white;
float:left;
}
.imagewrapper{
float:left;
width:180px;
height:140px;
margin-right:30px;
background-color:yellow;
}
ul{
margin:0px;
padding:0px;
margin-left:25px;
}

ul li{
list-style:disc outside none;
}

</style>
</head>

<body>
    <div class="somewrapper">
        <div class="imagewrapper">

        </div>
        <div class="teste">
            <h2>asdklfjaøskljf</h2>
            <ul>
                <li>aøsklfjaøs jasas fasfklf aaasfasasfa sfasfsdfasfas fasf asfasfasfasfasf asf as fasføsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
            </ul>
            <h2>asdfasfasfasdfasf</h2>
            <p>asdfasfasfaskjf aklsjf asjklf askljf </p>
            <ul>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
                <li>aøsklfjaøsjklfaøsjklf</li>
            </ul>
            <h2>asdfasfasfasdfasf</h2>
            <p>asdfasfasfaskjf aklsjf asjklf askljf </p>
        </div>

    </div>
</body>

Ответы [ 2 ]

2 голосов
/ 26 марта 2013

Альтернативный ответ - использовать list-style-position: inside;

2 голосов
/ 18 апреля 2011

Добавив переполнение: скрытый, а затем немного подправив отступ, я решил самую худшую часть.Он не будет полностью обтекать, но будет работать достаточно хорошо!

Итак, переполнение: скрытый ответ.

...