Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.58/12: Рейтинг темы: голосов - 12, средняя оценка - 4.58
 Аватар для superpuper
103 / 103 / 48
Регистрация: 09.09.2010
Сообщений: 241

IE Opera min-height ресайз окна

09.09.2010, 08:06. Показов 2277. Ответов 5
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте, уважаемые КиберПрограммисты и КиберСисадмины! Не помог мне ни Гугуль, ни Поиск, может вы поможете. Мой сайт :
Файл index.htm
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<link rel = "stylesheet" type = "text/css" href = "style.css"/>
</head>
<body>
    <div id="wrap">
        <div id="header">A</div>
        <div id="middle">
            <div id="leftColumn">A<br/>A</div>
            <div id="rightColumn">A</div>
            <div id="Content">A<br/>A<br/>A<br/>A<br/>A<br/>A<br/>A</div>
        </div>
    </div>
    <div id="foter">A</div>
    
</body>
</html>
Файл style.css
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
* {/***Reset***/
    border:0;
    margin:0;
    padding:0;
}
html, body {
    height: 100%;
}
/***Layout***/
body {
    background-color: grey;
    max-width: 800px;
    margin: 0 auto;
    min-width: 450px;
}
div#wrap {
    min-height: 100%;
}
#header {
    height: 200px;
    background-color: #1e90ff;
}
#wrap {
    background-color: #ffc0cb;
    overflow: hidden;
}
#leftColumn {
    width: 200px;
    float: left;
    background-color: #bdb76b;
    margin-bottom: -32767px;
    padding-bottom: 32767px;
}
#Content {
    background-color: white;
    margin: 0px 200px 0px 200px;
    padding-bottom: 50px;
}
#rightColumn {
    background-color: #66cdaa;
    float: right;
    width: 200px;
    margin-bottom: -32767px;
    padding-bottom: 32767px;
}
#foter {
    background-color: orange;
    position: relative;
    height: 50px;
    margin-top: -50px;
    clear: both;
}
Они же - во вложенном файле.
Проблем : В FF, GoogleChrome и Safari - всё OK. А вот в IE-8 и в Opera-10.10 (оба даже min-height чтят, я проверял) : 1) При ресайзе окна (вручную) влево-вправо или перезагрузке рисует правильно. 2) При ресайзе вверх-вниз футер остаётся на месте и к низу не прижимается. В найденных в сети рекомендациях по прижиманию футера (ie5,6 и т.п.) нюанс с ресайзом нигде не освещён. Как лечить ?
Вложения
Тип файла: rar site.rar (1.8 Кб, 17 просмотров)
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
09.09.2010, 08:06
Ответы с готовыми решениями:

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

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

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

5
БТР - мой друг
 Аватар для Hagrael
333 / 277 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
09.09.2010, 13:19
superpuper, поставьте у #wrap height: 100%. Хотя и правда странно, что не работает.
1
 Аватар для superpuper
103 / 103 / 48
Регистрация: 09.09.2010
Сообщений: 241
10.09.2010, 01:18  [ТС]
Hagrael, спасибо за ответ, футер прилип даже чересчур. Теперь не прячется вопше, зактывает и контент и шапку (если уменьшить высоту окна) как при pozition:fixed во всех браузерах.
Кстати, хотел посмотреть как в Джумле, обнаружил что все три дефолтные шаблоны без контента футер вниз не жмут. Может проблема с прижиманием вниз футера надумана? Хорошо наполнять надо.
0
11 / 11 / 1
Регистрация: 10.06.2010
Сообщений: 34
10.09.2010, 02:16
попробуйте другим способом
1
 Аватар для superpuper
103 / 103 / 48
Регистрация: 09.09.2010
Сообщений: 241
23.11.2010, 03:35  [ТС]
npofopr, ваш пример в IE-8 и Opera.10.10 даёт тот же результат, да и код CSS аналогичен. Лучшее из худших решение - JavaScript setInterval. Даже более опытные киберпрограммисты пришли к такому же решению.
0
БТР - мой друг
 Аватар для Hagrael
333 / 277 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
23.11.2010, 16:21
superpuper, нет, прижатый к низу футер - актуальная тема, а по поводу того, что он закрывает всё - поставьте
CSS
1
#wrap {min-height: (высота футера) + (сколько как минимум должно быть видно текста) +"px";}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
23.11.2010, 16:21
Помогаю со студенческими работами здесь

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

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

вложенные таблицы height 100% opera
table { width:100%; } .prt { height:100%; } .prt tr, .prt td { height:100%; } .td_wrap { height:100%; min-height:100%; } .td_d {...

Min-height у td
Не работает min-height у ячеек таблицы &lt;body&gt; &lt;table&gt; &lt;tr&gt; &lt;td&gt;Round 1&lt;/td&gt; &lt;td&gt;Round 2&lt;/td&gt; &lt;td&gt;Round...

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


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

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Новые блоги и статьи
Первый деплой
lagorue 16.01.2026
Не спеша развернул своё 1ое приложение в kubernetes. А дальше мне интересно создать 1фронтэнд приложения и 2 бэкэнд приложения развернуть 2 деплоя в кубере получится 2 сервиса и что-бы они. . .
Расчёт переходных процессов в цепи постоянного тока
igorrr37 16.01.2026
/ * Дана цепь постоянного тока с R, L, C, k(ключ), U, E, J. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа, решает её и находит токи на L и напряжения на C в установ. режимах до и. . .
Восстановить юзерскрипты Greasemonkey из бэкапа браузера
damix 15.01.2026
Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .
Изучаю kubernetes
lagorue 13.01.2026
А пригодятся-ли мне знания kubernetes в России?
Сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
WordPad для Windows 11
Jel 10.01.2026
WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11
Jel 10.01.2026
Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает?
Neotwalker 09.01.2026
В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru