body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
background: #637384;
margin: 0;
padding: 0;
text-align: center; /* выравнивает контейнер по центру в браузерах IE 5*. Затем для текста задается по умолчанию выравнивание по левому краю в селекторе #container. */
color: #000000;
}
.thrColAbsHdr #container {
position: relative; /* добавление положения: relative позволяет разместить две боковые панели относительно этого контейнера. */
width: 100%; /* уменьшение полной ширины, равной 800 пикселам, на 20 пикселов позволяет учесть chrome-элементы браузера и избежать добавления горизонтальной полосы прокрутки. */
background: #FFFFFF;
margin: 0 auto; /* автоматические поля (совместно с шириной) выравнивают страницу по центру. */
border: 1px solid #000000;
text-align: left; /* переопределяет свойство text-align: выравнивание элемента body по центру. */
}
/* Советы по боковым панелям с абсолютным позиционированием с верхним и нижним колонтитулами:
1. Для элементов с абсолютным позиционированием (АП) нужно задать свойство top и боковое положение — right или left. Если значение top не указано, элемент АП по умолчанию будет располагаться сразу же после последнего элемента в исходном порядке страницы. То есть, если боковые панели являются первым элементом в #container в исходном порядке документа, они будут отображаться вверху контейнера, даже если им не задано значение top. Тем не менее, если позже они по какой-либо причине будут перемещены в исходном порядке, для их отображения в нужном месте потребуется задать свойство top.
2. Элементы с абсолютным позиционированием (АП) "вырываются" из контекста документа. Это означает, что расположенные вокруг них элементы не знают об их существовании и не учитывают их, когда занимают свое пространство на странице. Поэтому элемент AP div должен использоваться в качестве боковой колонки только в том случае, если вы уверены, что средний элемент #mainContent div всегда будет вмещать большую часть содержимого. Если в любой из боковых панелей нужно было бы разместить больше содержимого, эта панель вышла бы за нижнюю границу родительского элемента div, а также за нижний колонтитул и не отображалась бы на странице.
3. При соблюдении вышеуказанных требований боковые панели с абсолютным позиционированием могут быть удобным средством управления исходным порядком документа.
4. В случае изменения исходного порядка значение top должно быть равным значению высоты верхнего колонтитула, поскольку в этом случае визуально колонки будут соответствовать верхнему колонтитулу.
*/


.thrColAbsHdr #sidebar2 {
position: absolute;
top: 313px;
vertical-align:bottom;
width: 1px; /* действительная ширина данного элемента div в совместимых со стандартами браузерах или в режиме стандартов браузера Internet Explorer будет включать отступ и границу в дополнение к этой ширине. */
background: #fff; /* цвет фона будет отображаться только на отрезке содержимого в колонке, но не дальше. */
}
.thrColAbsHdr #mainContent {
margin: 30px 100px 0 200px; /* правое и левое поля данного элемента div создают две внешние колонки по бокам страницы. Пространство этих колонок сохранится, несмотря на объем содержимого элементов sidebar div. */
padding: 0 10px; /* помните, что отступ — это пространство внутри блока div, а поле — пространство за блоком div. */
min-height: 410px;
}
.thrColAbsHdr #textContent {
margin: 0 200px 0 200px; /* правое и левое поля данного элемента div создают две внешние колонки по бокам страницы. Пространство этих колонок сохранится, несмотря на объем содержимого элементов sidebar div. */
padding: 0 10px; /* помните, что отступ — это пространство внутри блока div, а поле — пространство за блоком div. */
width: 75%;
height: 520px;
z-index:99;
}
.thrColAbsHdr #footer {
padding: 20px 10px 0 20px; /* это значение отступа соответствует выравниванию по левому краю элементов в блоках div, расположенных над ним. */
background:#fff;
text-align:center;
}
.thrColAbsHdr #footer p {
margin: 0; /* нулевые поля первого элемента в нижнем колонтитуле позволят избежать возможного сжатия полей, то есть появления пространства между элементами div. */
padding: 10px 0; /* добавление отступа к данному элементу создаст пробел (так, как он был бы создан с помощью поля), не вызывая при этом проблемы сжатия полей. */
}
.fltrt { /* этот класс можно использовать для обтекания элемента справа на странице. Обтекаемый элемент должен предшествовать элементу, рядом с которым он должен размещаться на странице. */
float: right;
margin-left: 8px;
}
.fltlft { /* этот класс можно использовать для обтекания элемента слева на странице. */
float: left;
margin-right: 8px;
}