Проблемы с перемещением изображения в Internet Explorer <8

Question

Я заметил очень неприятную проблему с атрибутом "float" css и Internet Explorer 6 и 7.

У меня есть HTML с 2 простыми изображениями:

<img src="aa.jpg">
<img src="bb.jpg" class="alignright">

Вот (очень простой) CSS:

.alignright { float: right;}

С помощью проводника первое изображение (без атрибута float): http://img5.imageshack.us/img5/2505/schermata4t.png

Есть ли способ исправить эту проблему с помощью CSS?

Answer 1

Я думаю, что это больше связано с тем фактом, что вы не перемещаете свое первое изображение, оставленное тоже.

проверьте http://jsfiddle.net/biznuge/KUnNn/3/ для подробностей этого.

Похоже, что это происходит в FF и для меня, а не просто <IE8, как вы предложили, так что, похоже, это ожидаемое поведение.

Answer 2

Для IE7 / IE6 вы должны ...

• плавать первое изображение слева
• плавающее второе изображение справа (или слева также)
• добавить «clear: both» к следующему текстовому блоку (если вы хотите, чтобы он появлялся после изображений)

http://jsfiddle.net/Kyq5u/

Я использовал пролеты для имитации изображений.

CSS ...

.img-a {
    background-color: red;
    padding: 100px;
    float: left;
}
.img-b {
    background-color: blue;
    padding: 100px;
    float: right;
}
p {
    clear: both;
}

HTML ...

<span class="img-a"></span>
<span class="img-b"></span>

<p>
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu  dolor et arcu dapibus cursus.
</p>

Answer 3

Поместите вещи, которые вы хотите плавать, сначала справа от контейнера (например, изображение 'bb.jpg' перед 'aa.jpg')