IE не изменяет ширину абсолютно позиционированного элемента

Когда я указываю height в стиле для любого элемента внутри этого IE делает всю вещь 100% шириной, вместо того, чтобы сохранять ее "автоматически изменяемой" для ширины.

Другие браузеры отображают это нормально, но не IE. Как это исправить?

<div style="position:absolute;top:50px;left:50px;background:green;">
 <div>
  <div>test</div>
  <div style="height: 20px;">this makes it 100% width in IE.  why?</div>
 </div>
</div>

Спасибо!

2 ответа

Решение

Вот кое-что, что может работать для вас. Это немного глупо, но если вы пытаетесь найти хорошую ширину для некоторого текста, это единственный способ, кроме известного мне javascript. Мы в основном увеличиваем ширину, не позволяя линии разрываться. Вы можете положить в <br/>Если вам нужны разрывы строк.

<div style="position:absolute;top:50px;left:50px;background:green;width:0px">
 <div>
  <div>test</div>
  <div style="height:50px; white-space:nowrap">This is normally sized in IE6</div>
 </div>
</div>

Если подумать, не проверяйте ссылку. Он старый и не работает как рекламируется.

Старый ответ:

http://snippets.dzone.com/posts/show/216

Я считаю, что не совсем позиционированные DIV автоматически расширяются, чтобы заполнить свой контейнер горизонтально. Поскольку вы не указали размер контейнера для этого div, он расширяется, чтобы заполнить всю страницу.

Я нахожу странным, что Firefox не расширяет div... Я не уверен, кто из них на самом деле имеет это "право".

Я бы сказал, что это как-то связано с ошибкой hasLayout в IE6. Мои предложения: 1. Дайте содержащему div (тот, который имеет абсолютное позиционирование) заданную ширину. 2. Опубликуйте пример того, чего вы пытаетесь достичь. Мы можем предложить более удобный для браузера способ делать то, что вы хотите.

Другие вопросы по тегам