wscms Сообщение 13/06/2011 10:49 Копия темы
Верстальщикам. Просьбы помощи пост Как заставить список с меню раздвигать основной контент?

Подробности под катом

 
На картинке схематический макет.
Допустим, что пользователь смотрит сайт в окне, шириной 1004 пикселя.
Если пункты меню не влезают – верстка должна расширяться и при этом должна появиться полоса прокрутки снизу

CSS:
div.wrapper {
min-width: 1004px;
max-width: 1600px;
margin: 0 auto;
min-height: 100%;
height: auto !important;
height: 100%;
}
div.header {
height: 155px;
min-width:100%;
position:relative;
}
div.header .menu_block{
position:absolute;
bottom:0px;
left:0px;
min-width:100%;
height:41px;
}
div.menu_block div.left_block{
float:left;
padding:12px 0 0 15px;
}
div.menu_block div.right_block{
А тут я потерялся
}

HTML:
<div class="wrapper">
<div class="header">
<div class="menu_block">
<div class="left_block">
</div>
<div class="right_block">

< li >Тут много пунктов меню. li{ float:left; }< /li >

</div>
</div>
</div>
</div>

chezare Сообщение 13/06/2011 11:02 Копия темы
у вас меню в блоке, который вложен в .menu_block, а для меню блок стоит высота и позишн абсолют, чтобы этот блок растягивал контент, абсолюта не должно быть и высоты

wscms Сообщение 13/06/2011 11:06 Копия темы
Возможно. Сейчас попробую, спасибо

chezare Сообщение 13/06/2011 11:11 Копия темы
я наверное неправильно поняла, вам нужно. чтобы по ширине растягивалось, не по высоте? В общей сложности непонятная структура, что в left_block хотите и что в right?

wscms Сообщение 13/06/2011 11:14 Копия темы
Да. По ширине.
Вот сделал тестовый по вашему совету – www.wscms.ru/test/ – не получается.

chezare Сообщение 13/06/2011 11:20 Копия темы
безразмерным горизонтальное меню лучше не делать, вы ж таким образом можете получить горизонтальный скролл на несколько страниц, если подразумевается большое динамическое меню, то его лучше сделать вертикальным, чтобы ни от чего не зависело, а у вас ещё левый блок с иконками 300 пикселей.

wscms Сообщение 13/06/2011 11:22 Копия темы
Таково ТЗ, к сожалению. Сам-то я это понимаю

chezare Сообщение 13/06/2011 11:22 Копия темы
Сейчас у вас задан минвидс 1004, поэтому естесственно этот блок падает, так как явно не помещаются левый  и правый вместе в минвидс 1004px. А если ширина меню не ограничена, тогда наверное лучше js-ом  считать, какой минвидс устанавливать. Если вы уберёте float:right для правого блока и поставите ему margin-left:300px (например), тогда не будет падать, будет переноситься на другую строку в зависимости от минвидса

wscms Сообщение 13/06/2011 11:30 Копия темы
Min-width – минимальная же ширина, почему она мешает расширению?
Вот я запихнул меню в свой контейнер, теперь не падает, но при большом количестве пунктов контейнер расширяется по высоте. А хотелось бы по ширине.

chezare Сообщение 13/06/2011 11:37 Копия темы
потому что, при уменьшении разрешения, больше минимальный ширины контейнер не будет

wscms Сообщение 13/06/2011 11:40 Копия темы
То есть средствами CSS сделать это невозможно? На JS не очень хочется пересчитывать

chezare Сообщение 13/06/2011 11:48 Копия темы
если уберёте у списка флоат райт, добавите white-space:nowrap, у li уберёт флоат лефт, тогда со скроллом вытяните, но заливка будет на ширине минимальной ширины

wscms Сообщение 13/06/2011 12:10 Копия темы
Спасибо за помощь, но тоже немного не то.
Заставить расшириться родительские контейнеры – видимо не получится.

RodgerFox Сообщение 13/06/2011 14:20 Копия темы
div.wrapper { 
min-width: 1004px; 
max-width: 1600px;  
....
}
а где сам width??? (Допустим, что пользователь смотрит сайт в окне, шириной 1004 пикселя.  ) вот и впишите ширину суда. мб браузер через который вы смотрите не понимает min-width.

wscms Сообщение 13/06/2011 14:26 Копия темы
Да все он понимает. И min- и max-width

Snig Сообщение 13/06/2011 16:29 Копия темы
что-то я не понял, зачем вам min-width: 1004px;  max-width: 1600px;   вообще. Просто поставьте width: 1004px да и все дела. А бекграунд присваивайте не нижнему блоку (в примере это div.menu_block) а самому врапу. Хотя возможно я вас не понял.

АПД: точнее даже не так, бекграунд на верхний блок врапа, а видз на меню_блок.

RodgerFox Сообщение 13/06/2011 16:42 Копия темы
а что терятся где стоит блок с меню или так же флоут левый или правый и поднять меню над левым блоком*. бред, имхо!