CSS ошибка в IE с плавающей точкой: правильно или аналогично - PullRequest
Новая
       18

CSS ошибка в IE с плавающей точкой: правильно или аналогично

1 голос
/ 21 июня 2011

У меня есть этот код: 

<body>

<ul style="padding:0px;margin:0px;list-style-type:none">
<li>
<div>
<img style="display:inline" src="asdf_files/eng.gif">&nbsp;
<img src="http://dl.dropbox.com/u/1663633/ita.gif">
<span style="float:right;width:80%;">
<a href="#">BLA BLA BLA BLA BLA</a>
</span>
</div>
</li>

</ul></body></html>

в Firefox и Chrome это нормально (строки выровнены) в IE 7 и 8 (я думаю, в 6 тоже ..) линии BLA BLA не выровнены ..

есть идеи? предложения как это исправить?

ПОПРОБУЙТЕ ЗДЕСЬ: http://jsfiddle.net/TGGFh/

Ответы [ 3 ]

2 голосов
/ 21 июня 2011

Все еще раздражающе неясно .. почему никто не понимает этого? http://sscce.org/

У вас в качестве первой строки указывается тип документа? Без него вы находитесь в режиме причуда , и у вас будет (как я думаю, ваше) описание поведения в всех версиях IE.

Если у вас нет типа документа, добавьте его в качестве первой строки, например <!DOCTYPE html>. Это исправит вашу проблему в IE9 и IE8.

Вот ваш jsFiddle, и он уже отлично работает в IE9 / 8: http://jsfiddle.net/TGGFh/
Это потому, что jsFiddle добавляет тип документа - просмотрите источник: http://fiddle.jshell.net/TGGFh/show/light/

Итак, я думаю, что ваша настоящая проблема только в IE7.

Что касается исправления IE7, то самое простое решение - это (в HTML) переместить ваш span с float: right на два изображения перед вами.

См .: http://jsfiddle.net/TGGFh/4/

0 голосов
/ 21 июня 2011

Попробуйте это: http://jsbin.com/ajiqa5/3/

Это был ваш float:right;. Это переполняло div и опускалось на новую строку. Я исправил это для IE / Chrome, но он должен работать на других.

0 голосов
/ 21 июня 2011

Если вы хотите отображать данные в табличной форме, почему бы не использовать таблицу?

...