Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.50/6: Рейтинг темы: голосов - 6, средняя оценка - 4.50
155 / 25 / 6
Регистрация: 06.06.2009
Сообщений: 262
1

не срабатывает min-height

06.03.2013, 14:35. Показов 1200. Ответов 3
Метки нет (Все метки)

Здравствуйте.
Есть блок, оборачивающий страницу. У него свойство height: 100%; min-height: 600px;. В этом блоке еще два со свойствами height:50%.
Так вот эти 50% не учитывают min-height родительского тега. То есть если окно уменьшить они тоже уменьшатся, хотя их родительский блок имеет min-height и соответственно не уменьшается меньше 600px. То есть эти 50% не учитывают свойство min-height родительского блока? Как это преодолеть?

http://jsfiddle.net/5w6jy/

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
        <div class="home-wrap">
            <div class="home-header">
                <div class="logo">
                    <a href="#!">
                        <img src="img/logo.png" alt="" width="50px" height="50px" />
                    </a>
                </div>
                <div class="logo-text">
                <a href="#!">
                    мосформат
                </a>
                </div>
            </div>
            <div class="home-body">
            </div>
            <div class="footer">
            </div>
        </div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
.home-wrap {
    height: 100%;
    min-height: 600px;
}
.home-header {
    position: absolute;
    height: 50%;
    background: red;
    width: 100%;
}
 
.home-body {
    background: blue;
    position: absolute;
    top: 50%;
    height: 50%;
    width: 100%;
}
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
06.03.2013, 14:35
Ответы с готовыми решениями:

блоки с height внутри min-height не растягиваются или wrapper не растягивается
вот такой вот пример &lt;html&gt; &lt;head&gt; &lt;style type=&quot;text/css&quot;&gt; * {margin:0; padding:0;} ...

max-height и min-height резиновый блок
есть див &lt;div class=&quot;main&quot;&gt;&lt;/div&gt; подключены стили .main{ border:1px solid #0C0;...

height внутри min-height
структура такова &lt;div id=&quot;wrapper&quot;&gt; # min-height 100% &lt;div id=&quot;block1&quot;&gt; height 60% width 30%...

Аналог min-width, min-height в CSS < 3
Ребят. Собственно, нужно как-то сделать страницу с этими параметрами (т.е. не обязательно с ними) ...

3
tribal dance
167 / 155 / 36
Регистрация: 03.09.2009
Сообщений: 820
Записей в блоге: 17
06.03.2013, 16:55 2
Цитата Сообщение от oke11o Посмотреть сообщение
Как это преодолеть?
попробуйте убрать position: absolute;
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
.home-header {
    /*position: absolute;*/
    height: 50%;
    background: red;
    width: 100%;
}
 
.home-body {
    background: blue;
    /*position: absolute;*/
    top: 50%;
    height: 50%;
    width: 100%;
}
0
155 / 25 / 6
Регистрация: 06.06.2009
Сообщений: 262
06.03.2013, 18:37  [ТС] 3
а вы сами это пробовали? Не получается вообщем
0
tribal dance
167 / 155 / 36
Регистрация: 03.09.2009
Сообщений: 820
Записей в блоге: 17
06.03.2013, 18:45 4
хм. видимо я неправильно задачу понял.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
06.03.2013, 18:45

Блок на растягивается на height:100%; min-height: 100%;
Подскажите пожалуйста, почему мне не получается растянуть блок во всю высоту браузера? Вроде бы...

DOCTYPE с min-height
Но ведь мой браузер понимает что я пишу даже без этого. Не указав этот тег я написал весь свой...

min-height не работает
у одного блока есть свойство min-height:700px; при наполнении содержимого больше чем 700 пикселей,...

Min-height: 100%
Для чего ставится min-height: 100% для html и body? Имеется код, написанный преподавателем по...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2022, CyberForum.ru