Высота слоя в процентах

Rigo · April 14, 2009

Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) высотой 40% и 60% (плюс, минус 2 процента для стыка), без образования скрола в браузере и пустого пространства.

Nekromancer · April 14, 2009

overflow:hidden;

всё что не в блоке будет пропадать

Rigo · April 14, 2009

overflow:auto;

Блок должен сохранять высоту, не зависимо от количества контента. Если контента больше, чем размер блока - в блоке должен появиться скрол.

Nekromancer · April 14, 2009

без образования скрола в браузере и пустого пространства.

разве это не ваши слова? вы определитесь чего хотите..

<!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>
  </head>
  <body>
  <div style=" height: 500px; width:150px; background: red;">
  <div style="height: 58%; width: 100%; background: black; color: #FFFFFF; overflow:auto;">Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) высотой 40% и 60% (плюс, минус 2 процента для стыка), без образования скрола в браузере и пустого пространства.</div>
  <div style="height: 40%; width: 100%; background: grey; margin-top: 7%;color: #FFFFFF; overflow:auto;">Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) </div>
  </div>
  </body>
  </html>

как то так

Edited April 14, 2009 by Nekromancer

Rigo · April 14, 2009

По поводу скрола - прошу извинить, не правильно изложил свою мысль. Скрол может быть применен к диву, но не к боди, т.е. два слоя, их граница и отступ между ними в сумме дают 100% высоты окна браузера.

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

Nekromancer · April 14, 2009

только если абсолютное позиционирование, и без отступов %)

вот то что вам надо

<!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>
  </head>
  <body>
  <div style="height: 100%; width:150px; background: red; position:absolute; top: 0; left:0;">
  <div style="height: 58%; width: 100%; background: black; color: #FFFFFF; overflow: auto;">Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) высотой 40% и 60% (плюс, минус 2 процента для стыка), без образования скрола в браузере и пустого пространства.</div>
  <div style="width: 100%; height: 2%;"></div>
  <div style="height: 40%; width: 100%; background: grey; color: #FFFFFF; overflow: auto;">Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) Высота слоя в процентах, заданная с помощью стилей просчитывается в разных браузерах по разному. Каким образом можно сделать два блока (один под другим) </div>
  </div>
  </body>
  </html>

Searcher · April 14, 2009

При использовании современных стандартов, т.е. при указании нормального DOCTYPE, высота в % во всех браузерах должна быть одинаковой. И по стандартам к указанной высоте добавляются все отступы и размеры границ. В результате указав 100% высоты и бордюр вы получите выход блока за пределы окна, что вызовет появление скрола.

Если необходим бордер, то можно, абсолютно позиционировать и указывать не высоту а координаты углов.

Nekromancer · April 14, 2009

ещё можно например 2 второго примера убрать абсолютное позиционирование, и поставить тегать <html> и <body> style="height: 100%;"

но тут вообще придётся обойтись без отступов, либо делать их изнутри контейнера..

Rigo · April 14, 2009

Хорошо, спасибо, попробую поэксперементировать с абсолютным позиционированием.

Searcher · April 14, 2009

Кстати, забыл предупредить, ИЕ до 7-го не понимает одновременного указания координат противоположных сторон... Для него нужны будут костыли.

Sign In

Высота слоя в процентах

Question

Rigo

Link to comment

Share on other sites

9 answers to this question

Recommended Posts

Nekromancer

Link to comment

Share on other sites

Rigo

Link to comment

Share on other sites

Nekromancer

Link to comment

Share on other sites

Rigo

Link to comment

Share on other sites

Nekromancer

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

Nekromancer

Link to comment

Share on other sites

Rigo

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information