позиционирование картинки внизу страницы (div'ы)

lampo4ka · March 17, 2008

Доброго времени суток ))

Вопрос такой. Как на страничке с фиксиорованным дизайном, свертанной div'ами с позиционированием, сделать,чтобы картинка отображалась в самом низу страницы при любой длине страницы?

Хелп, плиз, или "ткните носом", где почитать

Заранее, спасибо ))

Emm · March 17, 2008

http://htmlbook.ru/css/background-position.html

guvatara · March 17, 2008

Вам нужно чтоб там отображался фон или див?

lampo4ka · March 17, 2008

див

при любом разрешении экрана

и любой длине страницы

guvatara · March 17, 2008

Это решение где то взятое, но не помню где.

Короче валяется у меня в закромах родины.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
* {
 margin: 0;
 padding: 0;
 /* стандартное правило для удаления всех посторонних отступов */
}

html {
 height: 100%;
 /* чтобы элемент html распространялся на всю высоту окна браузера */
}

body {
 position: relative;
 /* чтобы потомки элемента body позиционировались по отношению к body */
 height: auto !important;
 /* для Firefox и Opera ? чтобы не сработало следующее объявление */
 height: 100%;
 /* для IE (работает некорректно, что обеспечивает нужный результат) */
 min-height: 100%;
 /* для Firefox и Opera (в IE 7 делает то же, что предыдущее объявление) */
}

.cont {
padding-bottom:54px;
/* высота футера */
}

.main {
width:100%;
height:100%;
min-height:100%;
background:#FFFF00;
}

.footer {
position:absolute;
bottom:0px;
margin-top:-54px;
height:54px;
width:100%;
background:#FF0000;
}
-->
</style></head>

<body>
<div class="cont">
 <div class="main" >
 <p>Тут</p>
 <p>идет</p>
 <p>основной</p>
 <p>контент</p>
 <p>сайта</p>
 </div>
</div>
<div class="footer">Это футер
</div>
</body>
</html>

Читаем и осознаем смысел решения.

lampo4ka · March 17, 2008

Огромное спасибо )))

Sign In

позиционирование картинки внизу страницы (div'ы)

Question

lampo4ka

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

Emm

Link to comment

Share on other sites

guvatara

Link to comment

Share on other sites

lampo4ka

Link to comment

Share on other sites

guvatara

Link to comment

Share on other sites

lampo4ka

Link to comment

Share on other sites

Обсуждения

Forums

Important Information