Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > подвал в опере

Автор: messulete 4.3.2009, 10:35

собственно пример взят отсюда 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

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

Код


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

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

Автор: messulete 4.3.2009, 18:51

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

Автор: fromXiper 5.3.2009, 20:40

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

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

Автор: fromXiper 5.3.2009, 20:58

и еще один способ - это если в контейнер 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>

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

Автор: messulete 5.3.2009, 21:17

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

Автор: fromXiper 6.3.2009, 15:52

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

Автор: Violator 8.3.2009, 02:22

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

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