[X] Помощник

[pazzytives Topic Starter]

Вопрос был выделен в отдельное производство из темы "Урок верстки"

Привет всем !!! Я тут новенький, потому просьба: сильно не пинайте. В общем я только учусь сайтостроению, но материала уже съел немало. Потому, по данному уроку вопросов нет и ничего нового он мне не открыл. В принципе по верстке вопросов возникает не так уж и много, но кое что меня ставит в тупик. Никак не могу понять логику поведения div-ов. Конкретный пример: Имеется два блока, один вложен в другой. Вот код CSS:

#background .bgheader {
    background:url(../images/hbackground.png) top repeat-x #6CF;
    }

#header {
    background-image:url(../images/header.png);
    height:279px;
    width:938px;
    margin:auto;
    }

Вот HTML :

<div class="bgheader">
<div id="header">
</div>
</div>

Вопрос такой: Почему когда я прописываю правило в CSS #background .bgheader без top, то рисунок ложится от левого верхнего угла окна браузера, и дальше повторяется по оси х. А если прописываю top, то рисунок ложится от правого верхнего угла контейнера header. На этом эффекте я в принципе добился того чего хотел, НО. Не догоняю логики поведения div-a. Может это просто глюк ? Профи, Объясните пожалуйста. А то надоело уже методом тыка добиваться того чего хочешь. Заранее благодарю за ответ.

З.Ы. просьба к администрации данного ресурса: не ругайтесь сильно, но я только зарегался и не могу пока создавать новых тем. посчитал эту самой подходящей.

[ZiTosS]

pazzytives,

А то надоело уже методом тыка добиваться того чего хочешь.

А зачем методом тыка? Идем и читаем спецификацию или лезем на спец. ресурс по данному вопросу, к примеру htmlbook.ru
Давайте посмотрим на атрибут background-position
Обязательно посмотрите в графу Значение по умолчанию и Аргументы
Мы конечно же используем background, но как становится понятным, этот атрибут включает все остальные.

Проверил сказанное вами:
1) Когда отсутствует top, повторение из верхнего левого угла.
2) Когда присутствует top, повторение начинается по центру вверху, как и должно быть

top = top center = center top = 50% 0% (по центру вверху)

А вообще, в background можно указать 2 позиции: от какого края по вертикали и от какого края по горизонтали мы хотели бы начать повторение фона.

elem
{
   background: url(../images/hbackground.png) [left|center|right] || [top|center|bottom];
}

[pazzytives Topic Starter]

М... Ясно теперь. Спасиба отдельное за оперативность. Ваш форум, как впрочем и htmlbook.ru теперь у меня в закладках.

[ZiTosS]

pazzytives, мы рады, тему закрываю.

Замечание модератора: Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней. Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой или обратитесь к любому из модераторов.