VPF::подвал в опере - Форум программистов

messulete

Дата 4.3.2009, 10:35 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 13
Регистрация: 16.12.2007

Репутация: нет
Всего: нет

собственно пример взят отсюда http://www.xiper.net/podval-k-nizu.html
при любых попытках подключить доктайп, footer в опере 9.62 отказывается прижиматься к низу, можно это как-то исправить?

Код


<?xml version="1.0" encoding="utf-8"?>
<!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" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>dfgd</title>
<style type="text/css">
* {margin: 0; padding: 0;} 
body {
background: #fff;
}
html,body {
height: 100%;
}
.main {
background: #999;
min-height: 100%;
}
* html .main { 
height: 100%; 
}
.hFooter { 
height: 40px;
}
.footer { 
background: #0000CC;
color: #fff;
height: 40px;
margin-top: -40px; 
}
</style>
</head>
<body>
<div class="main">
main block
  <div class="hFooter"></div>
</div>
<div class="footer">footer</div>
</body>
</html>

WebMast

Дата 4.3.2009, 16:03 (ссылка)

(нет голосов)

Загрузка ...

Front-end developer

Профиль
Группа: Участник
Сообщений: 105
Регистрация: 1.1.2009
Где: Беларусь

Репутация: 2
Всего: 2

Без доктайпа все супер.. А с доктайпом там написано, что нужно добовлять этот код в начале:

Код


<?xml version="1.0" encoding="windows-1251"?>

Там еще сказано что это для ie6, однако может сработает!

--------------------

Личный Блог Евгения ЖлобоРасширение vkleaner для Google Chrome

messulete

Дата 4.3.2009, 18:51 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 13
Регистрация: 16.12.2007

Репутация: нет
Всего: нет

у меня в начале это и есть кодировка только другая стоит, но и с windows-1251 не работает.

fromXiper

Дата 5.3.2009, 20:40 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 8
Регистрация: 12.2.2009

Репутация: нет
Всего: нет

интересный баг, спасибо за найденную ошибку.
исправляется добавлением пары свойств для body:

html,body {
height: 100%;
float: left;
width: 100%;
}

Это сообщение отредактировал(а) fromXiper - 5.3.2009, 21:09

fromXiper

Дата 5.3.2009, 20:58 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 8
Регистрация: 12.2.2009

Репутация: нет
Всего: нет

и еще один способ - это если в контейнер main вложить хотя бы один плавающий элемент (float: left / float: rigth):
<body>
<div class="main">
<div style="float: left">main block</div>
<div class="hFooter"></div>
</div>
<div class="footer">footer</div>
</body>
</html>

Чем вызван такой баг, объяснить затрудняюсь

Это сообщение отредактировал(а) fromXiper - 5.3.2009, 20:59

messulete

Дата 5.3.2009, 21:17 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 13
Регистрация: 16.12.2007

Репутация: нет
Всего: нет

спасибо Вам, за варианты исправления! и за классный сайт.

fromXiper

Дата 6.3.2009, 15:52 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 8
Регистрация: 12.2.2009

Репутация: нет
Всего: нет

Еще один способ побороть данный баг - вынести CSS в отдельный файл, подключаемый c помощью link.
При этом необходимость в дополнительных свойствах для body отпадает и все встает на свои места.

Это сообщение отредактировал(а) fromXiper - 6.3.2009, 15:56

Violator

Дата 8.3.2009, 02:22 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 234
Регистрация: 10.1.2009

Репутация: 15
Всего: 15

messulete,
данный баг в Опере появился по-моему именно с 9.62 версии, если вынести стили в css-файл все будет работать, либо просто добавить строку
<link rel='stylesheet' type='text/css' href='style.css' /> - даже если такого ксс нет, главное чтобы присутствовало подключение стайлшит

ps наверное разработчики Оперы хотят научить верстальщиков выносить стили в отдельные файлы smile

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »