Javascript-форум - div с overflow:hidden в старом ИЕ

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - div с overflow:hidden в старом ИЕ (https://javascript.ru/forum/dom-window/53304-div-s-overflow-hidden-v-starom-ie.html)

div с overflow:hidden в старом ИЕ

Столкнулся с проблемой, что при указании <!DOCTYPE HTML> в ИЕ в режиме совместимости, а также живой ИЕ6 не выполняет overflow:hidden. То есть примеры с просмотром фотографий в виде "карусели" не работают - все фото показаны в виде длинной "колбасы". div не вырезает нужного размера видимый прямоугольник.

Если в заголовке документа указать <!DOCTYPE HTML 4.01>, то div c overflow:hidden работает.

Дмитрий

Цитата:

Сообщение от geezer

при указании <!DOCTYPE HTML> в ИЕ в режиме совместимости

А зачем его в этот режим вгонять?

geezer, потому что старый IE не поддерживает HTML5, поэтому просто не понимает такой DOCTYPE.

Цитата:

Сообщение от Ruslan_xDD

потому что старый IE не поддерживает HTML5, поэтому просто не понимает такой DOCTYPE

<!DOCTYPE html> распознается всеми браузерами, включая IE6, и форсит документ в стандартный режим. Именно поэтому этот доктайп везде рекомендуют использовать без всяких оговорок.

Что касается проблемы geezer, думаю все как раз наоборот - <!DOCTYPE html> включает в IE6 стандартный режим, а <!DOCTYPE HTML 4.01> - quirks mode, потому как это некорректный доктайп. Таким образом у тебя стили написаны под quirks режим.
Это мое предположение.

geezer, Ни наю, у меня - работает в ИЕ6-7:

<!DOCTYPE HTML>
<html>
  <head>
<style>
div.over {
    overflow:hidden;
    width:100px;
    height:30px;
    border:red solid 1px;
}
</style>
  </head>
  <body>

     <div class="over">
         <img src="http://javascript.ru/forum/images/smilies/smile.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/stop.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/help.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/sad.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/smile.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/smile.gif"/>
      </div>

  </body>
</html>

<!DOCTYPE HTML 4.01>
<html>
  <head>
<style>
div.over {
    overflow:hidden;
    width:100px;
    height:30px;
    border:red solid 1px;
}
</style>
  </head>
  <body>

     <div class="over">
         <img src="http://javascript.ru/forum/images/smilies/smile.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/stop.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/help.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/sad.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/smile.gif"/>
         <img src="http://javascript.ru/forum/images/smilies/smile.gif"/>
      </div>

  </body>
</html>

Гы тут шестерка не тестит.. ушел к себе

Короче, https://hsivonen.fi/doctype/ - там внизу есть таблица. Так вот, по ней, даже если указать корректный 4.01 доктайп, IE6 его не поймет и уйдет в quirks.

Deff, а если вписать лажу <!DOCTYPE HTML 4.01> или из той самой таблицы взять корректный для 4.01 - тогда ломается overflow?

Цитата:

Сообщение от danik.js

а если вписать лажу <!DOCTYPE HTML 4.01> или из той

Ну <!DOCTYPE HTML 4.01> или <!DOCTYPE HTML> При заявленном выше коде отражаются идентично( пофег) и в ИЕ6 и ИЕ7

А вот с этим: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> ? Может geezer имел ввиду его?

Цитата:

Сообщение от danik.js

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

Попробовал и не ток это, но и такое : <!DOCTYPE ываываываыва>

Други, посмотрите, как вот это
http://gaz23.com/rus/construction2.htm
будет отображаться у вас в разных браузерах.
Там "карусель". У меня в ИЕ6 полная задница. В ИЕ10 всё ОК.

ИЕ6 начинает нормально показывать, если заголовок
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
или
<!DOCTYPE HTML PUBLIC HTML 4.01>

Но там другая проблема получается. Там с прокруткой косяк вылезает. Крутит вних до бесконечности.

Вроде нашёл причину.
Картинки упакованы в ul li.
У меня стоял стиль <li> position:relative;
Не помню, почему я relative поставил - давно было. Но без него работает во всех браузерах, включая ИЕ6.