Переполнение содержимого за пределами родительского div в ie6

#html #css #internet-explorer-6

#HTML #css #internet-explorer-6

Вопрос:

Следующий код:

 <div style="width: 50px; border: 1px solid green;">
    <div style="position: absolute;">
        whatever text you want
    </div>
</div>
  

Отображается следующим образом:

Современные браузеры

в любом современном браузере (ie7 , chrome, Firefox) и вот так:

IE6

в IE6.

Я бы хотел, чтобы он отображался в IE6 точно так же, как в других браузерах. Есть идеи?

Комментарии:

1. IE6 = доля рынка менее 2% и падает. Вам действительно нужно это поддерживать?

2. К сожалению, я делаю это, когда платящий клиент запрашивает это.

3. @Spudley: Когда клиент отслеживает ваш прогресс в работе над IE6 или вы создаете сайт для правительства, в ваших интересах поддерживать IE6. Когда это ваш личный блог или домашняя страница вашей собаки, это, вероятно, не важно.

4. Есть ли какая-то конкретная причина, по которой вы используете position: absolute ?

Ответ №1:

Почему бы вам просто не поместить текст за пределы div?

 <div style="width: 50px; border: 1px solid green;">
</div>
whatever text you want
  

Или

 <div style="width: 50px; border: 1px solid green;">
    <div style="position:absolute; width:XXpx">whatever text you want</div>
</div>
  

Это сработало бы для вас?

Комментарии:

1. Вы пропустили мою мысль. Представьте, что я не могу изменить способ отображения верхнего div, но я хочу вставить в него содержимое, которое выходит за его пределы.

2. для обновления: потому что это не то, что мне нужно. Мне нужно, чтобы содержимое дочернего div переполнялось.

Ответ №2:

Это известная проблема с IE6. (один из многих)

На этом сайте обсуждается проблема и способы ее решения: http://www.positioniseverything.net/explorer/expandingboxbug.html

Комментарии:

1. Я уже видел этот веб-сайт, но, похоже, не могу понять, как это применимо к моему примеру. Извините, что настаиваю, но не могли бы вы указать мне на исправление, примененное к моему примеру кода?

2. Прошло много времени с тех пор, как я использовал IE6, и у меня больше нет его на моем компьютере, поэтому я не могу дать вам проверенный ответ. Но мое предложение было бы таким же, как на той странице, на которую я ссылался: попробуйте добавить word-wrap свойство со значением break-word .