Плавающий % DIV с min-width для IE6

TonKhaO · January 27, 2010

Возникла такая проблема, вот код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>

<style>
#wrapper {

		   height: 100px;
		   background: silver;
		   width: 70%;
		   min-width: 1000px;
		   margin: 0 auto;

}
</style>


<!--[if IE 6]>

 <style type="text/css">
		* html #wrapper
		{
			width:expression(
				(document.compatMode && document.compatMode == 'CSS1Compat')
				?
				(
					this.clientWidth < 1000
					?
					"1000px"
					:
					(
						"auto"
					)
				)
				:
				(
					this.clientWidth < 1000
					?
					"1000px"
					:
					(
						"auto"
					)
				)
			);


		}
		</style>

<![endif]-->


</head>

<body>

<div id="wrapper"></div>

</body>

</html>

думаю из примера понятно что пытаюсь сделать, есть некий враппер, он выровнен по центру, ширина в процентах 70% и min-width: 1000px для него же

раньше приходилось делать подобное для IE6 но wrapper всегде был width: auto и проблем не возникало (ширина высчитывалась относительно BODY), а тут пришлось немного поэкспериментировать, тот экспрешн который в коде раньше расчитывал ширину враппера относительно ширины BODY но так как теперь wrapper не облигает боди полностью мне нужно чтобы его ширина высчитывалась относительно его же ширины, для этого я вставил там this (не знаю правильно ли в данном случае).

и вобчем как открываю IE6 начинаю сжимать окно, после того как достигается разрешение 1000пыкселей IE 6 конкретно зависает, не понимаю почему, помогите плз

TonKhaO · January 28, 2010

или может у кого есть готовый код для такого

Great Rash · January 28, 2010

http://www.cssplay.co.uk/boxes/width.html

psywalker · January 28, 2010

никогда так не парился, всегда задвал мин-виф для боди и всё

TonKhaO · January 28, 2010

http://www.cssplay.co.uk/boxes/width.html

ок, пасиб вечером гляну отпишу

никогда так не парился, всегда задвал мин-виф для боди и всё

а как же ИЕ6 он же не знает min-width

psywalker · January 28, 2010

а как же ИЕ6 он же не знает min-width

Експрешн понимает же

TonKhaO · January 28, 2010

Експрешн понимает же

ты хочешь сказать если вместо width:expression() написать min-width:expression()

он ие6 поймет такую запись?

psywalker · January 28, 2010

*html body { width:expression(document.documentElement.clientWidth < 900 ? "900px" : "auto");}

TonKhaO · January 28, 2010

*html body { width:expression(document.documentElement.clientWidth < 900 ? "900px" : "auto");}

ок пасиб, попробую, как всегда отпишусь

psywalker · January 28, 2010

ок пасиб, попробую, как всегда отпишусь

Давай, как всегда, удачи

TonKhaO · January 28, 2010

Уолкер, смари что то у меня такая конструкция не работает

<!--[if IE 6]>

 <style type="text/css">

	 * html body
		{
			width:expression(
				(document.compatMode && document.compatMode == 'CSS1Compat')
				?
				(
					document.documentElement.clientWidth < 1000
					?
					"1000px"
					:
					(
						"auto"
					)
				)
				:
				(
					document.body.clientWidth < 1000
					?
					"1000px"
					:
					(
						"auto"
					)
				)
			);
		}
		</style>

<![endif]-->

Edited January 28, 2010 by TonKhaO

psywalker · January 29, 2010

TonKhaO

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

TonKhaO · January 30, 2010

TonKhaO
Да потому-что ты какую-то хрень пишешь,я тебе дал код,твоя задача была тупо скопировать его,а не изобретать свои методы.

ну подумай вот взять opera, mozilla при разрешении 1000пикселей (min-width: 1000px;) див wrapper будет 1000 пикселей

теперь возбми ие6 при том же разрешении body будет 1000 пикселей, а див враппер (у которого width: 70%) будет сколько? прально будет явно 1000пыкселей, он будет 700px

поэтому тут так просто не обойтись заданием эекспрешна для боди

psywalker · January 30, 2010

ну подумай вот взять opera, mozilla при разрешении 1000пикселей (min-width: 1000px;) див wrapper будет 1000 пикселей
теперь возбми ие6 при том же разрешении body будет 1000 пикселей, а див враппер (у которого width: 70%) будет сколько? прально будет явно 1000пыкселей, он будет 700px
поэтому тут так просто не обойтись заданием эекспрешна для боди

Я чёт не понял, ты что хочешь, сделать просто Минимальную ширину в ИЕ6 или что?

TonKhaO · January 30, 2010

Я чёт не понял, ты что хочешь, сделать просто Минимальную ширину в ИЕ6 или что?

ну смотри принцип такой чтобы можно было сделать аналог того что происходит как ведут себя OPERA и MOZILLA и остальные нормальные браузеры, када я диву задаю процентную запись например width: 70%

и min-width: 1000px вот, именно нужно чтобы также выглядело в ие6, то есть плавающий до поры до времени процентный блок но с минимальной шириной

PS: то есть опера например и мозилла при разрешении < 1000px блок становиться 70% от родителя(в данном случае боди) а 1000пикселей на всю ширину родителя, без отступов (то есть min-width перебивает width)

вот ту ссылку которую дал Great Rash там как раз то что нужно, изучаю

http://www.cssplay.co.uk/boxes/width.html

Edited January 30, 2010 by TonKhaO

psywalker · January 30, 2010

ну смотри принцип такой чтобы можно было сделать аналог того что происходит как ведут себя OPERA и MOZILLA и остальные нормальные браузеры, када я диву задаю процентную запись например width: 70%
и min-width: 1000px вот, именно нужно чтобы также выглядело в ие6, то есть плавающий до поры до времени процентный блок но с минимальной шириной
PS: то есть опера например и мозилла при разрешении < 1000px блок становиться 70% от родителя(в данном случае боди) а 1000пикселей на всю ширину родителя, без отступов (то есть min-width перебивает width)
вот ту ссылку которую дал Great Rash там как раз то что нужно, изучаю
http://www.cssplay.co.uk/boxes/width.html

А покажи мне данный этап вёрстки, хочу посмотреть, как должно быть, в фф например

TonKhaO · January 30, 2010

А покажи мне данный этап вёрстки, хочу посмотреть, как должно быть, в фф например

вот http://seva.undersite.ru/ посмотри на блок с айди nonFooter, он по середине, тянущийся при разр больше 1000пикс и фиксированный менее 1000пикселей, вот так же нуно в ие

PS: Great Rash метод не работает при моем доктайпе, transitional

psywalker · January 30, 2010

вот http://seva.undersite.ru/ посмотри на блок с айди nonFooter, он по середине, тянущийся при разр больше 1000пикс и фиксированный менее 1000пикселей, вот так же нуно в ие
PS: Great Rash метод не работает при моем доктайпе, transitional

Ааа, это не о чём, лови

http://psywalker.ru/Forum/Min-widthIE6/main2.html

Кстати можешь тогда уж и чё хош уже ставить в ИЕ6, хоть мин-хейт, хоть фигейт, всё будет пахать. min-width:, max-width; , max-height, min-height; В общем все ребята в сборе.

mishka · January 30, 2010

Может так:

1000 - это 70% от 1428

значит если ширина окна менее 1428 то вернуть 1000px, иначе - 70%

тоесть

*html #wrapper { width:expression(document.documentElement.clientWidth < 1428 ? "1000px" : "70%");}

Мож получится

я ксожалению немогу проверить так как моник маленький, если будет ие6 зависать то возможно поправит дело указание нестрогого условия:

*html #wrapper { width:expression(document.documentElement.clientWidth <= 1428 ? "1000px" : "70%");}

Edited January 30, 2010 by mishka2

TonKhaO · January 30, 2010

Ааа, это не о чём, лови
http://psywalker.ru/Forum/Min-widthIE6/main2.html
Кстати можешь тогда уж и чё хош уже ставить в ИЕ6, хоть мин-хейт, хоть фигейт, всё будет пахать. min-width:, max-width; , max-height, min-height; В общем все ребята в сборе.

спасибо дорогой! то что нужно! вот только последний вопрос, как подключать этот скрипт, с условными комментами только для ие6?

просто я посмотрел на твою страницу в опере, там например стоит в диве background: red; а в опере никакого красного фана не видно, то есть стили перестают действовать для остальных?

Может так:
1000 - это 70% от 1428
значит если ширина окна менее 1428 то вернуть 1000px, иначе - 70%
тоесть
*html #wrapper { width:expression(document.documentElement.clientWidth < 1428 ? "1000px" : "70%");}
Мож получится
я ксожалению немогу проверить так как моник маленький, если будет ие6 зависать то возможно поправит дело указание нестрогого условия:
*html #wrapper { width:expression(document.documentElement.clientWidth <= 1428 ? "1000px" : "70%");}

mishka пасибо , но думаю решение Уолкера поудобнее, осталось только в нем разобраться, кстати советую тож всем на заметку

psywalker · January 30, 2010

спасибо дорогой! то что нужно! вот только последний вопрос, как подключать этот скрипт, с условными комментами только для ие6?
просто я посмотрел на твою страницу в опере, там например стоит в диве background: red; а в опере никакого красного фана не видно, то есть стили перестают действовать для остальных?
mishka пасибо , но думаю решение Уолкера поудобнее, осталось только в нем разобраться, кстати советую тож всем на заметку

Значит подключаешь в условных комментах спецом для Ие6

Кстати попробуй медведя способ, отпишишь, работает или нет? Просто у меня тут тоже экран галимый.

TonKhaO · January 30, 2010

Значит подключаешь в условных комментах спецом для Ие6

теперь я понимаю всю значимость ухода эпохи ие6, ты представляешь от скольки багов и недостатков мы избавимся?

будем меньше кода и более кроссово, предлагаю этот день сделать национальным праздником

PS: скоро конец месяца - выложу стату в тему

Edited January 30, 2010 by TonKhaO

psywalker · January 30, 2010

теперь я понимаю всю значимость ухода эпохи ие6, ты представляешь от скольки багов и недостатков мы избавимся?
будем меньше кода и более кроссово, предлагаю этот день сделать национальным праздником
PS: скоро конец месяца - выложу стату в тему

Давай, буду ждать

Sign In

Плавающий % DIV с min-width для IE6

Question

Link to comment

Share on other sites

22 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

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