Xpoint
   [напомнить пароль]

Верстка сайта DIV'ами с шапкой, меню и полем для информации

Метки: [без меток]
2012-01-23 15:13:07 [обр] Mariyska[досье]

Добрый день.
Мне нужно сверстать следующий сайт исключительно DIV'ами. Во внешний DIV погружены три DIV'a. Первый DIV Шапка тянется по ширине страницы и имеет фиксированный размер. Под ним расположены DIV'ы Меню и Информация, высота которых должна изменяться в зависимости от размера окна браузера.
Был написан код:
HTML

<!DOCTYPE html>
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title>Insert title here</title>
      <link rel="stylesheet" type="text/css" href="NewFile.css"/>
   </head>
   <body>
      <div id='main-content'>
         <div id='header'>
            <h1>Шапка</h1>
         </div>
         <div id='menu'>
            <h1>Меню</h1>
         </div>
         <div id='info'>
            <h1>Информация</h1>
         </div>
      </div>
   </body>
</html>

CSS

html,body {
   margin            : 0;
   padding            : 0;
   height            : 100%;
}
#main-content {
   border               : 5px ridge #8b7e96;
   position             : fixed;
   height               : 98%;
   width               : 99%;
   margin            : 2px;
}
#header {
   margin            : 2px;
   padding            : 2px;
   height            : 100px;
   background         : #FFEF97;
   border               : 5px ridge #8b7e96;
}
#menu {
   margin-left         : 2px;
   width            : 300px;
   height               : 85%;
   border               : 5px ridge #8b7e96;
   float            : left;
   background         : #FFC597;
}
#info {
   margin            : 2px 2px 2px 317px;
   border               : 5px ridge #8b7e96;
   padding            : 2px;
   height               : 84%;
}

Подскажите, пожалуйста, как решить следующие задачи:

  1. Растянуть внутренние DIV'ы с Меню и Информацией по всей высоте внешнего DIV'a и при этом внутренние DIV'ы имели бы один размер по высоте.
  2. Сделать так, чтобы при уменьшении размеров окна браузера внутренние DIV'ы Меню и Информация не выходили за границы внешнего DIV'a.
спустя 1 месяц 12 дней [обр] Евгений Седов aka KPbIC(3/187)[досье]
М Mariyska[досье] Может, в "Вакансии" перенести?
спустя 1 день 21 час [обр] Василий Свиридов(1/175)[досье]
Mariyska[досье] Возьмите темплейт Twitter Bootstrap и не мучайтесь...
Powered by POEM™ Engine Copyright © 2002-2005