Jump to content
  • 0

IE6 и background

Виноградов Александр

Asked by Виноградов Александр,

 Share

Question

Виноградов Александр Explorer

Виноградов Александр

Posted
Posted (edited)

Во всех браузерах, кроме IE 6 не работает позиционирование background по центру. Позиционирование слева или справа работает нормально, но по центру никак.

Код выгляди следующим образом:

<head>
<style>
div.style {

	background: url("img.jpg") left center repeat-x;
	height: 100%;
	width: 100%;

}
</style>
</head>
<body>
<div class = "style"></div>
</body>

Для проверки кода использую ietester. Может это его глюк?

Edited by Виноградов Александр
Link to comment
Share on other sites

12 answers to this question

Recommended Posts

  • 0
psywalker Explorer

psywalker

Posted
Posted
Во всех браузерах, кроме IE 6 не работает позиционирование background по центру. Позиционирование слева или справа работает нормально, но по центру никак.

Код выгляди следующим образом:

<head>
<style>
div.style {

	background: url("img.jpg") left center repeat-x;
	height: 100%;
	width: 100%;

}
</style>
</head>
<body>
<div class = "style"></div>
</body>

Для проверки кода использую ietester. Может это его глюк?

background: url("img.jpg") left center no-repeat;

Link to comment
Share on other sites
  • 0
mishka Explorer

mishka

Posted
Posted (edited)
background: url("img.jpg") left center no-repeat;

Да и с репитом тоже должно бы работать...

Виноградов Александр, а если в процентах задать?

background: url("img.jpg") repeat-x 50% 0;

И кстати - где доктайп?

Edited by mishka2
Link to comment
Share on other sites
  • 0
Виноградов Александр Explorer

Виноградов Александр

Posted
  • Author
Posted (edited)

Извини, сразу за опечатку. Там не репит - х должно быть. А no-repeat. Спасибо psywalker, не внимательно задал вопрос.

Но при no - repeat не хочет работать.

<!Doctype HTML Public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> доктайп тоже есть.

Просто может думаю ietester глючит. Мож у кого на виртуальной машине стоит IE 6 проверьте пожалуйста позиционирование бэкграудна по центру.

Edited by Виноградов Александр
Link to comment
Share on other sites
  • 0
psywalker Explorer

psywalker

Posted
Posted (edited)
Извини, сразу за опечатку. Там не репит - х должно быть. А no-repeat. Спасибо psywalker, не внимательно задал вопрос.

Но при no - repeat не хочет работать.

<!Doctype HTML Public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> доктайп тоже есть.

Просто может думаю ietester глючит. Мож у кого на виртуальной машине стоит IE 6 проверьте пожалуйста позиционирование бэкграудна по центру.

страницу давай свою

кстати заметил, у тя чё то пробелов до жопы не понятных везде, вот тут например смотри <div class = "style"></div>, между атрибутом и его значением, далее no - repeat такая же хрень, проверь, мож из за этого не пашет!

Edited by psywalker
Link to comment
Share on other sites
  • 0
SelenIT Explorer

SelenIT

Posted
Posted
left center
И когда иногда, вдохновеньем бурля,

Он кричал: 'Заворачивай носом!

Носом влево, а корпусом -- право руля!' --

Что прикажете делать матросам?

(Л.Кэррол, "Охота на Снарка", пер. Григория Кружкова)

Link to comment
Share on other sites
  • 0
Виноградов Александр Explorer

Виноградов Александр

Posted
  • Author
Posted 

<!Doctype HTML Public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>

#menu 
{
	background: url("img/menu.jpg") left center no-repeat;
	margin-top: 50px;
}


</style>
</head>

<body>

<div id = "menu">
	<ul>
		<li><a href = "#1">Малому бизнесу</a></li>
		<li><a href = "#2">Финансовым организациям</a></li>
		<li><a href = "#3">Ипотечное кредитование</a></li>
		<li><a href = "#4">Акционерам и инвесторам</a></li>
		<li><a href = "#5">Филиальная сеть</a></li>
		<li><a href = "#6">Пресс-центр</a></li>
	</ul>
</div>

</body>
</html>

Вот код.

Спасибо, с проблемой разобрался. Расскажу что было.

Суть данного кода расположить бэкграунд слева по центру меню. Данный код работал во всех браузерах, кроме IE6.

Проблема решается, если диву menu задать высоту. Например:

height = 200px;

После этого бэкграудн отображается поцентру блока во всех браузерах.

Но данное использование не очень удобно так, как не известна заранее высота блока, поэтому для IE6 буду использовать exrpession.

кстати заметил, у тя чё то пробелов до жопы не понятных везде, вот тут например смотри <div class = "style"></div>, между атрибутом и его значением, далее no - repeat такая же хрень, проверь, мож из за этого не пашет!

Да знаю. Пробелы люблю юзать, иногда чрезмерно. Зато стремлюсь код сделать более красивым. На работоспособность это не влияет. По крайней мере раньше не разу не мешало.

Link to comment
Share on other sites
  • 0
rus Explorer

rus

Posted
Posted

SelenIT

left center

Цитата

И когда иногда, вдохновеньем бурля,

Он кричал: 'Заворачивай носом!

Носом влево, а корпусом -- право руля!' --

Что прикажете делать матросам?

(Л.Кэррол, "Охота на Снарка", пер. Григория Кружкова)

Круто!

Link to comment
Share on other sites
  • 0
rash Explorer

rash

Posted
Posted
Проблема решается, если диву menu задать высоту. Например:

height = 200px;

После этого бэкграудн отображается поцентру блока во всех браузерах.

Но данное использование не очень удобно так, как не известна заранее высота блока, поэтому для IE6 буду использовать exrpession.

Скорее всего, проблема решается, если включить hasLayout. Его можно включить указанием ширины, флоатом, display: inline-block;, zoom.

Выберите наиболее подходящий способ, чтобы избавиться от экспрешена.

Link to comment
Share on other sites
  • 0
Виноградов Александр Explorer

Виноградов Александр

Posted
  • Author
Posted (edited)

Спасибо большое Rash. Гениально простое решение, просто 

zoom: 1;

и все работает. Кстати пытался скинуть значение hasLayout с помощью: 

float: none;

так не получается.

Кстати, только сейчас заметил, как раз при установке определенной высоты hasLayout становиться true.

Жаль, что zoom: 1; невалидное свойство.

Edited by Виноградов Александр
Link to comment
Share on other sites
  • 0
psywalker Explorer

psywalker

Posted
Posted
Спасибо большое Rash. Гениально простое решение, просто 

zoom: 1;

и все работает. Кстати пытался скинуть значение hasLayout с помощью 

float: none;

Кстати, только сейчас заметил, как раз при установке определенной высоты hasLayout становиться true.

Жаль, что zoom: 1; невалидное свойство.

в кондишнл комментс его и все дела :)

Link to comment
Share on other sites
  • 0
mishka Explorer

mishka

Posted
Posted
Жаль, что zoom: 1; невалидное свойство.

Есть валидное средство - height:1%; Только надо чтобы у родителя небыла указанна высота. Так как тогда высота элемента станет 1% от родителя. А если у родителя нет конкретно заданной высоты то и данному элементу ее будет не от чего отсчитывать, но hasLayout будет включен.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept