background-position в firefox

Zov · July 10, 2009

Господа!

Возникла проблема с FireFox.

Суть проблемы заключается в следующем.

HTML:

<html>
<head>
	<link rel="stylesheet" href="style/style2.css" type="text/css" media="screen">
</head>
<body>
  Тут много текста. Столько, что не убирается на одну высоту окна.
</body>
</html>

CSS:

html, body {
	margin:0;
	padding:0;
	position:relative;

	width:100%;
	height:100%;
}
body {
	background-image:url(logo_lines.png);
	background-repeat:no-repeat;
	background-position:95% 100%;
	/* background-position:97% bottom; */
}

Создается такое впечатление, что ff считает высоту у body 100% равную одной высоте окна браузера, а не полную высоту, которую занимает страница.

Как быть? Помогите, пожалуйста.

На всякий случай приведу версию браузера 3.0.3.

Veseloff · July 10, 2009

Создается такое впечатление, что ff считает высоту у body 100% равную одной высоте окна браузера, а не полную высоту, которую занимает страница.

Да, так оно и есть. Если дадите ссылку на страницу, то будет понятнее что сделать, чтобы избавиться от проблемы.

psywalker · July 10, 2009

попробуй так:

html, body {
	margin:0;
	padding:0;
	position:relative;

	width:100%;
	height:100%;
}
body {
	background-image:url(logo_lines.png);
	background-repeat:no-repeat;
	background-position:95% 100%;
	/* background-position:97% bottom; */
min-height: 100%;
}

Great Rash · July 10, 2009

А что надо сделать? А то может background-attachment: fixed; подойдет?

Zov · July 13, 2009

Простите, интернета не было.

попробуй так:
min-height: 100%;

вновь ff считает 100% длиной экрана, а не страницы.

Да, так оно и есть. Если дадите ссылку на страницу, то будет понятнее что сделать, чтобы избавиться от проблемы.

это на локальной машине, своего сайта не имею -(

А что надо сделать? А то может background-attachment: fixed; подойдет?

не подходит, получится что картинка будет "бегать" за прокруткой, а надо чтоб строго сидела на своем месте - внизу.

psywalker · July 13, 2009

Вот так вот:

<style type="text/css">
*{ margin: 0; padding: 0;}
html { height: 100%; height: auto; }
body { min-height: 100%;background: url(../img-padding/30.jpg) bottom right no-repeat; }
</style>

Zov · July 13, 2009

Вот так вот:

<style type="text/css">
*{ margin: 0; padding: 0;}
html { height: 100%; height: auto; }
body { min-height: 100%;background: url(../img-padding/30.jpg) bottom right no-repeat; }
</style>

:blink: это чудо!! ЧУДО!!! -)))

Спасибо огромное!!

psywalker · July 13, 2009

blink.gif это чудо!! ЧУДО!!! -)))
Спасибо огромное!!

Нет, это не чудо, а обычный опыт! :blink:

Blanzh · July 15, 2009

Народ, а не работает!

Проблема в том, что во "всех" браузерах, кроме ИЕ (6, выше не проверял) пропал бэкграунд.

Zov, у которого чудо, какой доктайп? Может у меня из-за него трабл?

У меня <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

psywalker · July 15, 2009

проверял с таким: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Blanzh · July 15, 2009

Да, реакции 0!

Это просто какое-то "ЧУДО"!

Zov · July 15, 2009

Blanzh, у меня <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">, но только IE7...на 6 пока нет возможности проверить

оп! только что проверила в ie6, все работает.

Edited July 15, 2009 by Zov

Sign In

background-position в firefox

Question

Link to comment

Share on other sites

11 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information