Wanamingo
-
Posts
11 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Wanamingo
-
стало получше почти во всех браузерах отображается нормально в эксплорере 6 и ниже второй фон липнет не к нижней границе окна а к низу страницы и с оперой 9.80 проблемы в остальном я доволен оставлю так только для эксплорера гифы отрисую psywalker огромное тебе спасибо
-
вот такой вот код вроде работает <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Windows-1251"> <title>шаблончег</title> <style> *{ margin: 0; padding: 0; } html { height: 100%; overflow: auto; } body { background: #dde2ed url('images/bg.jpg') no-repeat fixed center bottom; height: 100%; } #dom { min-height: 100%; background: url('images/dom.png') no-repeat fixed left bottom; position: relative; } #foot { position: absolute; bottom: 0; width: 100%; } p { background: url('images/fon.png'); margin: 0px 50px 0px 300px; } </style> </head> <body> <div id="dom"> <p>Lorem ipsum dolor sit amet...</p> <br> <div id="foot"> <p>Футер</p> </div> </div> </body> </html> щас буду проверять на других браузерах
-
спасибо это от невнимательности не заметил просто
-
избавился от контейнера с контентом не помогло <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Windows-1251"> <title>шаблончег</title> <style> *{ margin: 0; padding: 0; } html { height: 100%; overflow: auto; } body { background: #dde2ed url('images/bg.jpg') no-repeat fixed center bottom; height: 100%; } #dom { min-height: 100%; background: url('images/dom.png') no-repeat fixed left bottom; padding: 0px 50px 0px 300px; position: relative; } # foot { background: url('images/fon.png'); position: absolute; bottom: 0; height: 50px; width: 100%; } p { background: url('images/fon.png'); padding-bottom: 70px; } </style> </head> <body> <div id="dom"> <p>Lorem ipsum dolor sit amet...</p> <div id="foot"> Футер </div> </div> </body> </html> футер по прежнему игнорирует бэкграунд
-
ещё почему-то в моём варианте реализации перестал восприниматься цвет фона футера правда он туда случайно попал но всё же у боди и хтмл прописано height: 100%; <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Windows-1251"> <title>шаблончег</title> <style> *{ margin: 0; padding: 0;} html { height: 100%; overflow: auto; } body { background: #dde2ed url('images/bg.jpg') no-repeat fixed center bottom; height: 100%; } #dom { min-height: 100%; background: url('images/dom.png') no-repeat fixed left bottom; } #cont { min-height: 100%; background: url('images/fon.png'); margin: 0px 50px 0px 300px; padding: 0px; text-align: justify; font: 80% arial; position: relative; } # foot { position: absolute; bottom: 0; left: 0; height: 50px; width: 100%; background: red; } p { padding-bottom: 70px; } </style> </head> <body> <div id="dom"> <div id="cont"> <br> <p>Lorem ipsum dolor sit amet...</p> <div id="foot"> Футер </div> </div> </div> </body> </html>
-
min-height вложенный в другой див работает только если высоту жёстко прописать
-
хмммм ставлю доктайп и min-height: 100%; для контейнера с вторым фоном перестаёт работать
-
вот только сейчас прочитал что это за зверь такой и для чего он нужен
-
ничего не понимаю для контента вставлено min-height: 100%; но почему-то не растягивает=( #end { position: relative; height: 50px; } нужен чтобы контент не наползал на футер для футера прописано margin: -30px 50px 0px 300px; и height: 30px; от чего он должен нползать на область end почему не работает?
-
тогда для контента position: absolute; ? первый фон и так на боди убрал у контейнера со вторым фоном fixed, поставил min-height: 100% теперь страничка и в фаерфоксе ведёт себя так же как в 6 эксплорере если для контента ставлю position: absolute; вверх уходит только футер (здесь ещё конструкция для прижимания футера к нижнему краю) ааа кажется доперло нужно контент внутрь контейнера со вторым фоном загнать вроде работает но футер перестал к низу жаться
-
Добрый вечер перешёл на css совсем недавно, раньше верстал табличками. Понадобилось сделать страничку с двумя фонами, идея в том что первый фон остаётся неизменным, а второй будет меняться в зависимости от контента. Фаерфокс и опера отображают шикарно (правда при проверке на браузершотс фф3.5 тоже себя неадекватно повёл, но я склонен думать что это глюки браузершотс он просто не дал до конца загрузиться странице) а вот с эксплорером возникли проблемы. 7 и 8 версии не отображают контента 6 отображает но он съехал на один скрин плюс нет прозрачности в пнг но это отдельный вопрос. вот код: <html> <head> <title>шаблончег</title> <style> body { margin: 0px; padding: 0px; border: 0px; background: #dde2ed url('images/bg.jpg') no-repeat fixed center bottom; height: 100%; width: 100%; } #dom { height: 100%; width: 100%; background: transparent url('images/dom.png') no-repeat fixed left bottom; margin: 0px; padding: 0px; border: 0px; position: fixed; z-index: -2; } #cont { background: transparent url('images/fon.png') repeat scroll; margin: 0px 50px 0px 300px; padding: 0px 10px; border: 0px; text-align: justify; position: relative; min-height: 100%; font: normal normal normal 80% normal arial, sans-serif; } * html #cont { height: 100%; } #head { background: transparent; margin: 0px; padding: 0px; border: 0px; text-align: right; } #end { position: relative; height: 50px; } #foot { background: transparent; margin: -30px 50px 0px 300px; padding: 0px 10px; border: 0px; text-align: center; position: relative; height: 30px; font: normal normal normal 60% normal arial, sans-serif; } </style> </head> <body> <div id="dom"> </div> <div id="cont"> <div id="head">ссылка | ссылка | ссылка<br><br></div> Lorem ipsum dolor sit amet... <div id="end"></div> </div> <div id="foot"> © бла-бл-бла 2010 </div> </body> </html> скрины: ie6, ie7, ie8, ff3.0, ff3.5, ff3.6, ff4.0, chrome5.0, opera8.54, opera9.63, opera9.80, safari4, safari5 пример странички: здесь как можно добиться максимальной кроссбраузерности? ещё буду благодарен если укажите на другие ошибки.