немогу сделать чтобы основной див менял высоту в зависимости от того сколько в нем элементов. вот код Код (Text): <!-- HUT --> <div style="width:550px; height:28px; background:url(../img/template/header.jpg); margin:auto;"> <div style="padding:5px 15px;">привет</div> </div> <!-- MAIN --> <div style="width:550px; background:url(../img/template/body.jpg); margin:auto;"> <div style="width:339px; float:left; background-color:#FFFFFF;"> <div style=" width:339px; height:25px; background:url(../img/template/nav.jpg);"> <div style="padding:5px 10px;">привет</div> </div> <div style="padding:5px 10px;">привет</div> </div> <div style="width:211px; float:left; background:url(../img/template/menu_top.jpg); background-repeat:no-repeat;"> <div style="padding:5px 10px;">привет</div> </div> </div> <!-- FOOTER --> <div style="width:550px; height:32px; background:url(../img/template/footer.jpg); margin:auto;"> <div style="padding:15px 15px;">привет</div> </div> все это добро отображается вот так а надо вот так подскажите, что поделать?
Что-то оно не отображается даже как на 1й картинке IE FF & Chrome HTML: <style type="text/css"> div { border:1px solid; } </style> <div style="width:550px; height:28px; background:url(../img/template/header.jpg); margin:auto;"> <div style="padding:5px 15px;">Header</div> </div> <!-- MAIN --> <div style="width:550px; background:url(../img/template/body.jpg); margin:auto;"> <div style="width:339px; float:left; background-color:#FFFFFF;"> <div style=" width:339px; height:25px; background-color:orange;"> <div style="padding:5px 10px;">привет</div> </div> <div style="padding:5px 10px; background-color:fuchsia">привет</div> </div> <div style="width:211px; float:left; background-color:green; background-repeat:no-repeat;"> <div style="padding:5px 10px;">привет</div> </div> </div> <!-- FOOTER --> <div style="width:550px; height:32px; background-color:aqua; margin:auto;"> <div style="padding:15px 15px;">Footer</div> </div>
именно так и отображается) в пяти разных браузерах при загруженных бэкграундах и такой css'ке Код (Text): body { margin:25px; font-family:Tahoma, Verdana, Arial; font-size:11px; color:#8BA1AE; background-color:#8BA1AE; } и таким доктайпом Код (Text): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Уже лучше - везде одинаково, но футер все-равно уехал вбок от 3х элементов header привет footer привет привет И если я правильно помню то бэкграунды не растягивают контейнер вовсе Ты обрати внимание приветов у тебя 5ть, а на картинках только 4ре Чего-то ты не договариваешь... А касательно выравнивания соседних div по высоте....
последний "привет" сливается с фоном на скрине... там типо копирайт должен быть слева от значка xhtml. я реально код из дримвивера прямо копирнул, и мне все выводится как на первом скрине во всех браузерах
Шаман Я понимаю. Но у меня выводится как я написал. header привет footer привет привет Как делать колонки одинаковой высоты - примеров масса. Ссылку я дал. Есть даже решения на javascript.