Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Минимум по высоте

Автор: belkobot 1.9.2010, 14:37

Как сделать блок по высоте растягивающимся на 100% но чтобы минимум был 700 пикселей?

Автор: magelan 1.9.2010, 15:43

делаешь блок растягивающийся на 100% и кладешь в него блок шириной 700 точек или прозрачную картинку, по желанию.

Автор: ksnk 1.9.2010, 15:47

belkobot, min-height + хак для IE 6. Хачить лучше родными ie-шными conditional-comments . В качестве хака пойдет "Распорка" -

Код


<!--[if IE 6]><div style="overflow:hidden;width:1px; float:right:1px;height:700px;"/><![endif]-->

вставленная в нужное место.
можно еще подключать htc-хак (где-то в гугле поковыряться нужно...) для приведения IE в кондицию.

Автор: blah 1.9.2010, 18:14

ksnk, magelan,
width откуда? О высоте вроде как речь.

belkobot,

Цитата(belkobot @ 1.9.2010, 13:37

)

растягивающимся на 100%

От чего?
Хотя все равно, чистыми стилями не разрулить.

Автор: ksnk 1.9.2010, 18:43

Цитата(blah @ 1.9.2010, 18:14

)

width откуда? О высоте вроде как речь.

угу... поправился ;)

если наплевать на ie6, то вполне можно обойтись и просто стилями. если подключить http://code.google.com/p/ie7-js/, то в остальном можно обойтись стилями...

Автор: ksnk 1.9.2010, 20:26

Кстати, разбираясь в htc, ссылку на который я дал выше, обнаружил забавный комментарий в тексте (строка 1394 файла ie7/src/IE7.js )

Код


    layout.minWidth = function(element) {
      // IE6 supports min-height so we frig it here
      //#if (element.currentStyle.minHeight === "auto") element.runtimeStyle.minHeight = 0;
      if (element.currentStyle["min-width"] != null) {

Может не стоит и огород городить? Типа, все и так работает...
Кому проще проверить?

Автор: SelenIT 2.9.2010, 00:12

Оригинальный комментарий, однако. Можно подумать, в движке заимплементили, а в парсер CSS добавить забыли? :) Надо спросить у Дина Эдвардса прямым текстом, что он имел в виду.

Насколько я в курсе, в IE6 обычный height на самом деле ведет себя как min-height (что подтверждается 1510-й строчкой из того же ie7.js, где, судя по всему, делается прямая замена второго на первое). Поэтому голыми стилями задать и резиновую высоту, и фиксированный минимум там нельзя. Можно заюзать экспрешн (типа offsetParent.clientHeight > 701 ? '700px' : '100%' - осторожно, не проверял) или в самом деле вертикальную распорку...

Автор: blah 2.9.2010, 15:32

Цитата(SelenIT @ 1.9.2010, 23:12

)

в парсер CSS добавить забыли?

В том и дело что и в парсере есть и в движке есть, но не работает.
Правда только min-height smile

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script type="text/javascript">
    function minH(){
        alert(document.getElementById("test").currentStyle.minHeight);
        alert(document.getElementById("test").currentStyle.minWidth);
    }
    </script>
</head>
<body onload="minH()">
<div id="test" style="min-height:200px; min-width:300px"></div>
</body>
</html>