css в полный рост? - PullRequest
0 голосов
/ 28 мая 2009

Я создаю веб-страницу из 3 столбцов (заголовок и строка меню над левой навигационной панелью, основной областью и правой боковой панелью с нижним колонтитулом на всю ширину внизу). У меня есть цвета фона для каждого столбца, но они обрезаются в конце текста вместо заполнения всего столбца. Есть ли способ заполнить весь столбец, который не зависит от таблицы (td)?

Вот мой CSS для общего макета:

#container
{
    float: left;
    width: 100%; /* IE doubles the margins on floats, this takes care of the problem */
    display: inline; /* this is where Ryan Brill (author of the ALA's article) and I go in "opposite directions" */
    margin-left: -200px;
}
#left
{
    float: left;
    width: 180px; /* IE doubles the margins on floats, this takes care of the problem */
    display: inline;
    margin-left: 200px;
    padding: 0px 0px 0px 5px;
    background: url('/App_Themes/Default/images/RightColumnBackground.png') repeat left top;
}
#main
{
    /* the width from #left (180px) + the negative margin from #container (200px) */
    margin-left: 380px;
    padding: 0px 0px 0px 5px;
}
#sidebar
{
    /* this is to keep the content of #sidebar to the right of #main even if the content of "main is shorter */
    padding-left: 100%; /* this is to "bring back" the #sidebar that has been moved out of the viewport because of the padding value */
    margin-left: -220px;
}

Я знаю, что могу установить высоту в стиле, но это привязывает высоту к определенному количеству пикселей. Есть ли вариант типа height: fill;?

Ответы [ 3 ]

2 голосов
/ 28 мая 2009

Это очень распространенная проблема. Хороший подход заключается в использовании искусственных столбцов .

1 голос
/ 28 мая 2009

Нет в любом CSS, который в настоящее время широко поддерживается в разных браузерах, но есть способы приблизить его .

0 голосов
/ 28 мая 2009
...