Отступ в IE 5.5/6.0

my-name-is-Max · June 2, 2008

Всем привет!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

	<head>
		...
	</head>

	<style type="text/css">
		#left {
			float: left;
			width: 31%;
			margin-left: 2%;
		}
	</style>

	<body>
		<div id="left">
			...content...
		</div>
	</body>

</html>

Отступ в IE 5.5/6.0 от левого края в 2-3 раза больше, чем в остальных браузерах (включая IE 7/8). При отключении опции ?float: left? отсуп становится нормальным, но мне эта опция необходима (верстка трехколоночная, следующий div располагается следом за этим).

Заранее спасибо за помощь.

Azadi · June 2, 2008

display:inline для проблемного блока?

my-name-is-Max · June 2, 2008

display: inline не помогает.

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

Поэтому временный вариант я выбрал такой:

	*html #left {
		margin-left: 1%;
	}

Но это вариант ? кривой (чтобы успокоить дизайнера ), на самом деле хотелось бы найти нормальное решение.

ZooY · June 3, 2008

Проблема с отступом в IE отлично описана вот в этой статье http://www.artlebedev.ru/tools/technogrett...rgin_3px_in_ie/

Кроме того у тебя в коде CSS есть еще одно слабое место. Все специалисты по CSS советуют, для того чтобы избежать лишних непонятных проблем, никогда у блока не задавать сразу и размер и отступы/поля. Возникающие проблемы связанны с тем, что браужеры по разному понимают что такое поле, что такое отступ, где и как они должны распологаться.

Поэтому вместо

<div style="width: 31%; margin-left: 2%;">
...
</div>

надо писать например так

<div style="width: 31%;">
<div style="margin-left: 2%;">
...
</div>
</div>

my-name-is-Max · June 5, 2008

ZooY, спасибо.

Проблема решена:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

	<head>
		...
	</head>

	<style type="text/css">
		#wrapper {
			margin-left: 2%;
		}

		#left {
			float: left;
			width: 31%;
		}
	</style>

	<body>
		<div id="wrapper">
			<div id="left">
				...content...
			</div>
		</div>
	</body>

</html>

Sign In

Отступ в IE 5.5/6.0

Question

my-name-is-Max

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

Azadi

Link to comment

Share on other sites

my-name-is-Max

Link to comment

Share on other sites

ZooY

Link to comment

Share on other sites

my-name-is-Max

Link to comment

Share on other sites

Обсуждения

Forums

Important Information