Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: Высота div в 100%
Форумы портала PHP.SU » Клиентская разработка » HTML, Дизайн & CSS » Высота div в 100%

Страниц (1): [1]
 

1. Yuriy - 23 Октября, 2008 - 04:38:46 - перейти к сообщению
Хочу на своих страницах сделать так, чтобы независимо от количества информации на ней в центральном блоке - "подвал" всегда был внизу страницы. Это для ситуации, когда страница помещается на экран без скролла. Всё находится в одном диве, которому даю стиль height: 100%, чтобы добиться своего. Всё хорошо, а вот стоит поставить

<!DOCTYPE html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">

как снова меня ожидает большой облом - в процентах высота просто никак не воспринимается... В пикселях - да.

Как тогда увеличить высоту дива на 100%? Огорчение
2. valenok - 24 Октября, 2008 - 13:45:47 - перейти к сообщению
никак.
Просто своему footerу position:fixed; width:100%; bottom:0;
а body любую картинку в качестве backgroundа. не обязательно вовсе существующую, главное чтоб была прописана картинка.

Если при скроле футер будет прыгать, то и body указываем position:fixed
3. Yuriy - 24 Октября, 2008 - 20:53:59 - перейти к сообщению
valenok пишет:
никак.
Просто своему footerу position:fixed; width:100%; bottom:0;
а body любую картинку в качестве backgroundа. не обязательно вовсе существующую, главное чтоб была прописана картинка.

Если при скроле футер будет прыгать, то и body указываем position:fixed


Спасибо, но при таком подходе, имея 2 дива - для контента и подвала, при уменьшении окна они налазиют друг на друга... А ещё не получается выровнять по центру body.

CODE (text):
скопировать код в буфер обмена
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <style>
  5. body
  6. {
  7. padding: 0;
  8. margin: 0 auto;
  9. background-image: url(blank.gif);
  10. }
  11. #content {
  12. border: 1px solid blue;
  13. width: 900px;
  14. }
  15. #foot
  16. {
  17. position:fixed;
  18. width: 900px;
  19. height: 50px;
  20. bottom:0;
  21. border: 1px solid orange;
  22. }
  23. </style>
  24. </head>
  25. <body>
  26. <div id="content">
  27. content
  28. content
  29. content
  30. content
  31. content
  32. content
  33. content
  34. </div>
  35. <div id="foot">footer</div>
  36. </body>
  37. </html>
  38.  


З.Ы. Не очень понимаю, что даёт картинка...
4. valenok - 24 Октября, 2008 - 22:13:59 - перейти к сообщению
своего рода "хакфикс"
--
с ресайзингом ничего не поделаешь, потому что либо ты указываешь где элементу находится, и он там будет находится всегда, хоть убей. Либо не указываешь.

<center></center>
text-aling:center;
margin: auto;
5. Yuriy - 24 Октября, 2008 - 23:07:56 - перейти к сообщению
valenok пишет:
с ресайзингом ничего не поделаешь, потому что либо ты указываешь где элементу находится, и он там будет находится всегда, хоть убей. Либо не указываешь.


Мне давали тут другие варианты выравнивания подвала снизу и чтобы при ресайзинге было всё в порядке, но в IE от подвала до нижнего края страницы появляется отступ. С какого фига - непонятно. Естественно, пробовал bottom:0 - бесполезно. А так всё как нужно. Но вот отступ...

valenok пишет:
<center></center>
text-aling:center;
margin: auto;


Смотри, я в боди прописал ведь выравнивание:

margin: 0 auto;

это уже косяки из-за postion:fixed.

Сейчас ещё подумаю, что сделать с этим отстпупом в других примерах и приведу его здесь.
(Добавление)
Не, не получается... Вот код - контент и подвал.

В IE под подвалом отступ, в отличие от других браузеров. Всё остально меня устраивает, но от отступа избавиться не могу Недовольство, огорчение Есть идеи?

CODE (text):
скопировать код в буфер обмена
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="ru">
  3. <head>
  4. <link rel="stylesheet" type="text/css" href="#" />
  5. <style>
  6.     html, body {
  7.     margin:0 auto;
  8.     width: 900px;
  9.     height:100%;
  10.     }
  11.     #content {
  12.     position:relative;
  13.     min-height:100%;
  14.     height:auto !important;
  15.     height:100%;
  16.     }
  17.     #footer {
  18.     position:relative;
  19.     margin-top:-100px;
  20.     height:100px;
  21.     width:900px;
  22.     background:#646464;
  23.     }
  24. </style>
  25. </head>
  26. <body>
  27.         <div id="content">
  28.      Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст
  29.         </div>
  30.         <div id="footer"></div>
  31. </body>
  32. </html>
  33.  
6. Agassi - 30 Октября, 2008 - 19:12:10 - перейти к сообщению
Народ помогите в одном деле


Есть
PHP:
скопировать код в буфер обмена
  1. <div id="button_id4" style="text-align:center;position:absolute;top:60pt;left:-200pt;width:200pt;height:300pt">
  2.  


в нео нужно засунуть таблицу n количества

Как зделать чтоб у дифа скрол появился,и диф не менял размеры.
7. Yuriy - 30 Октября, 2008 - 19:17:13 - перейти к сообщению
http://htmlbook[dot]ru/css/overflow[dot]html
8. Agassi - 30 Октября, 2008 - 19:51:11 - перейти к сообщению
СПС.

Жаль что Токо в IE это есть


PHP:
скопировать код в буфер обмена
  1. Примечание
  2.  
  3. [b]Браузер Internet Explorer [/b]поддерживает также параметр overflow-x, который отображает полосу прокрутки по горизонтали и overflow-y, он отвечает за полосу прокрутки по вертикали. Аргументы те же, что и для overflow.
  4.  

(Добавление)
Или уже везде?????
9. valenok - 31 Октября, 2008 - 13:56:26 - перейти к сообщению
написано же overflow
не overflow-х и не overflow-у и даже не overflow-z

 

Powered by ExBB FM 1.0 RC1