VPF::помогите сверстать 4е волшебные колонки на DIVах

Vaulter

Дата 6.1.2007, 01:36 (ссылка)

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

Загрузка ...

Эксперт

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

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

понадобилась такая структура страницы (в силу резиновости)
/-------------------------------------- страница ---------------------------------------------------------------------------------------/
/-----170px-----/----макс. растяжимый блок -----/-----------------------200px------------------------/----------100---------/
/--------------------------------------------------------------------------------------------------------------------------------------------/

как такое сверстать на дивах?
начал с этого:

Код


    <div id='head'>
        <div id='headleftleft'>
            <div id='headleftcenter'>
                <img id='minwidth174' src='img/minwidth174.gif' width=174 height=1/>
                <div id='headleftright'>
                    <div id='headright'>
                    </div>
                </div>
                
            </div>
        </div>
    </div>

а в CSS как начал лазить smile

ейбогу... половина IE не делает как надо (а в офисе все на нем сидят smile

)
короче ужас...
как сделать незнаю...
бьюсь 10 час!
помогите smile

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

Wolf1994

Дата 6.1.2007, 10:31 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1701
Регистрация: 5.10.2004

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

Боюсь, что взаимосвязные смежные ячейки возможно сделать, только на таблицах.

лёгкий offtop.
В чём принципиальность вёрстки на div?

PARROT

Дата 6.1.2007, 15:52 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Экс. модератор
Сообщений: 2339
Регистрация: 5.1.2005
Где: Спб-ЦарьГрад

Репутация: 2
Всего: 50

http://webmascon.com/topics/coding/43a.asp

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

Безумный утешается прошедшим, слабоумный - будущим, умный - настоящим!

Vaulter

Дата 6.1.2007, 18:42 (ссылка)

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

Загрузка ...

Эксперт

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

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

Wolf1994, да ни вчем smile

сам сижу и думаю, а ну это все в баню!

PARROT, о! добрый человече

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

Vaulter

Дата 6.1.2007, 20:08 (ссылка)

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

Загрузка ...

Эксперт

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

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

все гениальное просто:

Код


<style>
#head {height:140px;width:100%;margin:0;padding:0;border-collapse:collapse;
            background: #002a4d url("img/headleftcenter.jpg") repeat-x;
            }
#headleftleft {background: #002a4d url("img/headleftleft.jpg") no-repeat;
            position:absolute;top:0;left:0;
            height:140px; width: 125px;}
#headleftright {background: #002a4d url("img/headleftright.jpg") no-repeat;
            position:absolute;top:0;right:212px;height:140px; width:389px;}
#headright {background: white url("img/romewar.ru.jpg") no-repeat; position:absolute; top:0;right:0;
            height:140px; width: 212px;}
</style>
    <div id='head'>
        <div id='headgraph'>
            <div id='headleftleft'></div>
            <div id='headleftright'></div>
            <div id='headright'></div>
        </div>
</div>

если кому понадобится ;)
+ мне smile

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

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