Как сделать фиксированное боковое меню с масштабированием основного контента до края экрана?

Question

Как создать макет, в котором у вас есть боковое меню с фиксированной шириной, но основное содержимое масштабируется до остальной части экрана?

Вот пример разметки:

<ul id="sideMenu">
   <li>....</li>
</ul>
<div id="mainContent">
   ... everything else ...
</div>

Возможно ли это?

Кроме того, было бы замечательно, если бы мы могли установить минимальную ширину для mainContent, а также чтобы это работало последовательно для всех браузеров;)

Answer 1

Плавающее sideMenu и затем установите поле mainContent, чтобы соответствовать этому. Это не позволяет mainContent обернуться вокруг sideMenu.

#sideMenu{float:left;width:200px;}
#mainContent{margin-left:200px;}

Answer 2

это может быть возможно, поместив содержимое ur в таблицу, где cellspacing и cellpadding установлены на 0. Установите ширину td также на 100%.Все, что вам нужно сделать, это метод проб и ошибок, чтобы увидеть.