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)

geezer 29.01.2015 01:25

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

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

Дмитрий

danik.js 29.01.2015 01:30

Цитата:

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

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

ruslan_mart 29.01.2015 02:34

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

danik.js 29.01.2015 03:02

Цитата:

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

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

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

Deff 29.01.2015 03:20

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>

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

danik.js 29.01.2015 03:28

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

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

Deff 29.01.2015 03:34

Цитата:

Сообщение от danik.js
а если вписать лажу <!DOCTYPE HTML 4.01> или из той

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

danik.js 29.01.2015 03:42

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

Deff 29.01.2015 19:14

Цитата:

Сообщение от danik.js
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

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

geezer 30.01.2015 17:23

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


Часовой пояс GMT +3, время: 21:01.