Как увеличить высоту страницы в проекте? - PullRequest
Новая
       27

Как увеличить высоту страницы в проекте?

0 голосов
/ 24 августа 2011

Используя blueprint.css, есть ли способ растянуть <div> до высоты страницы? Я знаю, как сделать это на чистом CSS, но ничто из того, что я нашел, не подсказывает, как сделать это с помощью светокопии, поэтому у меня остался <div> с фоном, который останавливается на полпути вниз по странице (что выглядит ужасно).

1 Ответ

0 голосов
/ 08 июня 2012

Для этого нет класса Blueprint, и быстрый grep покажет, что необходимый CSS не отображается в проекте.

Compass обрабатывает его с помощью набора stretch mixins .stretch-y добавляет следующий элемент CSS к элементу: 

bottom: 0;
position: absolute;
top: 0;

Поскольку элементы с абсолютным позиционированием не взаимодействуют с плавающими элементами, вам потребуется &nbsp; в div с background-color, которыйвы хотите и соответствующий width (т.е. дать ему правильный span- # класс).

Чисто презентационный div выглядит как хак, но мне он нравится больше, чем Faux Column method.

Возможно, вы захотите включить: 

html, body {
    height: 100%;
}

и следующее для вашего контейнера, чтобы придать ему 100% высоты, и чтобы внутри него происходило абсолютное позиционирование div: 

min-height: 100%;
height: auto !important;
height: 100%;
position: relative;

и, возможно, даже этот IE взломать , хотя это может быть необходимо только с нижним колонтитулом: 

<!--[if !IE 7]>
    <style type="text/css">
        #wrap {display:table;height:100%}
    </style>
<![endif]-->
...