Само окно divа выглядит следующим образом:
<div>
здесь содержимое блока
</div>
Если мы его просто вставим в нтм1-верх, то мы его увидим над нашей шапкой. лиюо в левом верхнем углу. Чтобы такого не было мы моем прописать:
<div style="position: absolute; width: 320px; height: 200px; top:50px; left:-120px;">
здесь содержимое блока
</div>
в данном случае мы увидим блок прозрачным, но он будет 320х200рх и находиться с отступом сверху в 50рх, и будет находится левее шапки на 120рх.
Для такого рода блоков мы уже на шапке рисуем поле для него, но чтобы постоянно не прорисовывать на каждой шапке под блок поле, мы можем прописать следующее:
<div class="news">
здесь содержимое блока
</div>
Т.е. задать нашему блоку класс и прописать весь его стиль в окне стилей.
.news {background: #d2cdb9 url(); width: 200px; height: auto; border: 3px solid #cdc9a5; position: absolute; z-index: 1000; top: 0px; right: 310px; left: 840px; box-shadow: 0 0 10px #000000;
-moz-box-shadow: 0 0 10px #000000;
-webkit-box-shadow: 0 0 10px #000000; }
Общие характеристики блока, цевт фона, при желании картинка, ширина, высота, границы и отступы, также добавление тени, и скругление углов по желанию.
.news h1 , .news h2 , .news h3 {
background: #d2cdb9 url(); height: 17px; text-align: center; color: #333333; border: 0px none; width: 90%; margin: auto;}
Это содержимое блока, также можно задать цвет фона/картинку, позиционарование содержимого, границы. и ширина (% от ширины общей характеристики блока), а именно для заголовков заключенных в теги <h1></h1>; <h2></h2> и т.д.
.news p {padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; text-align: center;}
Это отвечает за содержимое блока, а именно за параграфы (<p></p>), отступы от границы прописанной в общей характеристики и позиционирование текста.
Также в divы можно вставлять и ещё divы, с другими функциями, например как навигация здесь.
пробуй на этот же дизайн ставь просто.
