Извините, ничего не найдено.

Не расстраивайся! Лучше выпей чайку!
Регистрация
Справка
Календарь

Вернуться   forum.boolean.name > Веб-программирование > JavaScript / HTML

JavaScript / HTML Создание динамической разметки страниц

Ответ
 
Опции темы
Старый 13.02.2013, 22:14   #1
h1dd3n
Бывалый
 
Аватар для h1dd3n
 
Регистрация: 19.06.2008
Сообщений: 679
Написано 264 полезных сообщений
(для 450 пользователей)
Помогите с разметкой

Привет!
Прошу помочь с разметкой страницы... Как я вижу "это":

При этом header и footer фиксированы по высоте (30-40 px) по ширине должны занимать всю страницу, но не более чтобы не было скроллбаров.
list растягивается вместе со страницей но по ширине также фиксирован, и наконец map занимает "все остальное". Пример: maps.rosreestr.ru (у них там в верстке есть и служебные дивы, но общий смысл тот же). Я сначала посмотрел их css и сделал так же, но есть проблема - если я изменяю размеры браузера, то верстка на это никак не реагирует (может это надо на js делать?)... В принципе на место map дива я создам ext panel и содержание буду добавлять именно в панель. Если кто-нибудь может что-нибудь подсказать, буду очень благодарен)
PS
текущий вариант (list и map в данном случае объединены 1 див):
#gismain {
    position: fixed;
    bottom: 35px;
    top: 41px;
    left: 10px;
    right: 10px;
    margin: 0px;
}
#gisheader {
    height: 41px;

    position: fixed;
    top: 0px;
    left: 10px;
    right: 10px;

    border-bottom: 1px solid #d3d3d3;

    text-align: right;
}
#gisfooter {
    border-top: 1px solid #d3d3d3;

    position: fixed;
    bottom: 0px;
    left: 10px;
    right: 10px;

    height: 35px;
}
__________________
(Online)
 
Ответить с цитированием
Старый 13.02.2013, 22:34   #2
den
Дэвелопер
 
Аватар для den
 
Регистрация: 13.02.2010
Сообщений: 1,645
Написано 620 полезных сообщений
(для 2,419 пользователей)
Ответ: Помогите с разметкой

http://jsfiddle.net/hVTWj/
вот моё вИденье, на правильность не гарантирую, сам не так давно этим делом занялся)
upd: для main задал высоту в сто пикселей для примера, на деле он будет тянутся если там будет что-нибудь.
(Offline)
 
Ответить с цитированием
Сообщение было полезно следующим пользователям:
h1dd3n (14.02.2013)
Старый 13.02.2013, 22:45   #3
moka
.
 
Регистрация: 05.08.2006
Сообщений: 10,429
Написано 3,454 полезных сообщений
(для 6,863 пользователей)
Ответ: Помогите с разметкой

В следующий раз, будь добр воспользоваться http://jsfiddle.net/ чтобы сделать пример и выложить его - как твои наработки.
А остальные смогут без проблем отредактировать.

Вот: http://jsfiddle.net/2kSrT/1/
И протестируй его гибкость тут: http://moka.co/restest/#http://fiddl.../2kSrT/1/show/
(Offline)
 
Ответить с цитированием
Эти 3 пользователя(ей) сказали Спасибо moka за это полезное сообщение:
h1dd3n (14.02.2013), Randomize (14.02.2013), ІГРОГРАЙКО (22.02.2013)
Ответ


Опции темы

Ваши права в разделе
Вы не можете создавать темы
Вы не можете отвечать на сообщения
Вы не можете прикреплять файлы
Вы не можете редактировать сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.


Часовой пояс GMT +4, время: 15:55.


vBulletin® Version 3.6.5.
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Перевод: zCarot
Style crйe par Allan - vBulletin-Ressources.com