Верстка из трех слоев.

Тема в разделе "Верстка", создана пользователем UDAV, 2 май 2013.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. UDAV

    UDAV

    Регистр.:
    22 июн 2007
    Сообщения:
    781
    Симпатии:
    153
    Помогите сверстать.
    Сверху и снизу есть фиксированные слои. В не зависимости от экрана они всегда закреплены.
    Между этими слоями нужно сделать еще один слой который бы растягивался на весь экран за минусом верхнего и нижнего слоя, т.е. чтоб средний слой не заходил на другие два.

    В среднем слое содержится контент. Появляется прокрутка только у среднего слоя.

    ееыаи5п.jpg
    Примерно вот что надо сделать.
    Максимум что получилось это сделать фиксированным средний слой. А надо чтоб он подстраивался под мониторы.
     
  2. kadurinho

    kadurinho

    Регистр.:
    21 июн 2011
    Сообщения:
    601
    Симпатии:
    242
    футер и шапку не трогаем, для контента указываем высоту в пикселях + параметр overflow:scroll. хлопаем в ладоши и радуемся
     
  3. UDAV

    UDAV

    Регистр.:
    22 июн 2007
    Сообщения:
    781
    Симпатии:
    153
    kadurinho и как при указании точного кол-ва пикселей средний слой будет подстраиваться под разные размеры экрана? Да к тому же я написал что фиксированный размер получается сделать.
     
  4. gogikman

    gogikman Писатель

    Регистр.:
    14 июл 2010
    Сообщения:
    8
    Симпатии:
    0
    Берешь высоту хедера (h), высоту футера и высоту окна браузера на javascript.
    h(окна браузера) - h(хедера) - h(футера) = h(среднего слоя)

    и тоже самое действие вешаешь на ресайз окна браузера, чтобы пересчитывалось каждый раз при изменении размеров окна
     
  5. UDAV

    UDAV

    Регистр.:
    22 июн 2007
    Сообщения:
    781
    Симпатии:
    153
    a33 нет. нужно чтобы блок с контентом был ПОЛНОСТЬЮ показан на экране и если контента много, то у этого слоя появляется скролл.

    Удалось сделать через жквери.
    Может кому пригодится.

    Код:
        var height = $(window).height() - 130;
        $("#content").css("height", height);
        $(window).resize(function(){
            var height = $(window).height() - 130;
            $("#content").css("height", height);
        });
     
  6. sitecreator

    sitecreator

    Регистр.:
    1 май 2013
    Сообщения:
    209
    Симпатии:
    17
    Насколько успел заметить, у вас путаница в понятиях "слой" и "блок". говорите "слой", но подразумеваете блок. а это совершенно разные вещи.
    слой не может растягиваться и изменяться в размерах, у слоя просто нету таких свойств вообще, у него есть только один параметр: Z - это (косвенно) положение относительно других слоев.
     
  7. COVORP

    COVORP Писатель

    Регистр.:
    20 дек 2012
    Сообщения:
    5
    Симпатии:
    3
    UDAV и penguen нравится это.