VPF::<div> вылезает из <div> - Форум программистов

Vreden

Дата 7.6.2011, 11:17 (ссылка)

(нет голосов)

Загрузка ...

Idiotic Admin

Профиль
Группа: Участник
Сообщений: 295
Регистрация: 12.7.2006

Репутация: нет
Всего: 1

Код


<style type="text/css">
#Body
{
    margin: 0px;
    width: 100%;
    background-color: #DAF3FD;
}

#MainCenterContainer 
{
    margin: auto;
    width: 1000px; 
    height: 100%;
    background-color: #FFFFFF;
}

#LeftTopLineBlock
{
    float: left;
    width: 10px;
    height: 200px;
    background: transparent url('../Images/TopLeftLine.jpg');
}

#CenterContainer 
{
    float: left;
    width: 980px;
    height: 100%;
    background: transparent url('../Images/TopCenterBackground.jpg') repeat-x 0 0;
}

#RightTopLineBlock
{
    float: left;
    width: 10px;
    height: 200px;
    background: transparent url('../Images/TopRightLine.jpg');
}
</style>
<body id="Body">
    <div id="MainCenterContainer">
        <div>
            <div id="LeftTopLineBlock"></div>
            <div id="CenterContainer"></div>
            <div id="RightTopLineBlock"></div>
        </div>
        <div> 
            <div id="LeftTopLineBlock"></div>
            <div id="CenterContainer"></div>
            <div id="RightTopLineBlock"></div>
        </div>
    </div>
</body>

Есть два ряда дивовов (которые без стилей).
Первый ряд становится корректно. Однако, второй ряд не становится на место, как должен, а именно

Код


... 
<div id="CenterContainer"></div>
<div id="RightTopLineBlock"></div>
...

второго ряда вылазят за пределы дива <div id="MainCenterContainer">.
То есть эти два дива отражаются под сайтом.
Как разместить несколько рядов таких дивов корректно?

Во вложении визуальная схема. Как есть и как нужно.

Это сообщение отредактировал(а) Vreden - 7.6.2011, 11:27

Присоединённый файл ( Кол-во скачиваний: 12 )

_____.jpg 39,47 Kb

--------------------

Чё? Как? ©

Vreden

Дата 7.6.2011, 11:46 (ссылка)

(нет голосов)

Загрузка ...

Idiotic Admin

Профиль
Группа: Участник
Сообщений: 295
Регистрация: 12.7.2006

Репутация: нет
Всего: 1

Косяк найден

Код


#CenterContainer 
{
    float: left;
    width: 980px;
    height: 100%;
    background: transparent url('../Images/TopCenterBackground.jpg') repeat-x 0 0;
}

height: 200px;

--------------------

Чё? Как? ©

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »