body, html {
margin:7px; /*Это хорошая практика обнулять поля и отсупы, т.к. различные браузеры их по разному воспринимают. */
padding:0px;
text-align:center; /*Выравниваем макет по центру в старых версиях браузеров */
}

/*Здесь пишем стили для левой колонки сайта */
#left{

background-color: #CDDEEB;
width:210px;  /*ширина колонки */
float:left;  /*обязательное выравнивание по левому краю,с включением обтекания*/
 margin: 0px 2px;
 display : block;
 text-align : left;
}

   a:link {
    color: #F97C00; /* Цвет ссылок */
    padding: 2px; /* Поля вокруг текста */ 
   }
   a:hover {
    color: #CA6500; /* Цвет ссылки */ 
   } 
   a:visited {
    color: #CC4200;
   }
   ul {
    width: 210px; /* Ширина меню */
    list-style: none; /* Для списка убираем маркеры */
    margin: 0; /* Нет отступов вокруг */
    padding: 0; /* Убираем поля вокруг текста */
    font-family: Arial, sans-serif; /* Рубленый шрифт для текста меню */
    font-size: 10pt; /* Размер названий в пункте меню */
   }
   LI UL {
    position: absolute; /* Подменю позиционируются абсолютно */
    display: none; /* Скрываем подменю */
    margin-left: 165px; /* Сдвигаем подменю вправо */
    margin-top: -2em; /* Сдвигаем подменю вверх */
   }
LI A {
    display: block; /* Ссылка как блочный элемент */
    padding: 5px; /* Поля вокруг надписи */
    text-decoration: none; /* Подчеркивание у ссылок убираем */
    color: #666; /* Цвет текста */
    border: 1px solid #ccc;	/* Рамка вокруг пунктов меню */
    background-color: #f0f0f0; /* Цвет фона */
    border-bottom: none; /* Границу снизу не проводим */
   }
   LI A:hover {
    color: #ffe; /* Цвет текста активного пункта */
    background-color: #5488af; /* Цвет фона активного пункта */
   }
   LI:hover UL { 
    display: block; /* При выделении пункта курсором мыши отображается подменю */
   }

#container{
margin:0 auto;  /*выравниваем макет по центру в современных браузерах */
text-align:left;  /*Отменяем tex-align:center заданное в Body. Делаем чтобы весь текст в макете выравнивался по левому краю */
min-width:500px;  /*задаем минимальную ширину макета в современных браузерах */
width:expression(   /*задаем минимальную ширину макета в старых версия браузера. Просто замените цифру на свою шиирину :) */
}


#content{
background-color:#f4f6f8;
margin:0px; /*обнуляем отступы сверху и снизу*/
margin-left:252px; /*обязательный отступ слева, должен быть немного больше ширины левой колонки */
}
#content h1 {
margin:0px; /* Обнуляем отсупы для заголовка первого уровня, находящегося в блоке контента.*/
text-align:center;
font-size: 14pt;
} 
#content p {
margin:0px; /* Обнуляем отсупы для параграфов я, находящегося в блоке контента.*/
padding:5px; /*задаем поля, т.е. чтобы был промежуток между строками, чтобы было понятно, что это параграф :)*/
text-align:justify;
}