четверг, 18 марта 2010 г.

Как "отлепить" горизонтальное меню (navbar) от верхней кромки страницы.

С этой навязчивой идеей я решил исследовать стили шаблона с одной колонкой (родной гугловский шаблон этого блога). Представьте, в частности, что горизонтальное меню (navbar) этого блога "прилепелно к верхнему краю страницы... (Посмотрите на картинке слева)  Надо же сделать "просвет"... Итак, исследуем код страницы с помощью FireBug.
Вот блоки горизонтального меню:
<div id="HTML1" class="widget HTML">
<div class="widget-content">
<div id="menu">
<!-- id="menu" это уже блок не блоггера,
а плагина JQuery -->
А вот стили для них:
#main .widget {
padding-bottom:10px;
margin-bottom:20px;
border-bottom:dotted 1px $bordercolor;
clear: both;
}
Вопросы, возникшие у меня при изучении шаблона (вот он полность, кстати ;
весь код код
):
1) в таблице CSS задан стиль для класса "widget", а в коде есть class= "widget HTML", но нет просто класса "widget"... Стоп..., припоминаю, кажется здесь присвоение сразу двух классов... в одних кавычках через пробел... ?
2) что такое clear: both; эта строчка встречается очень часто..., все лень посмотреть...
А мне нужно исправить следующие недостатки посредством CSS: Штрих линия - убрать вообще,

Комментариев нет:

Отправить комментарий