Расстояние между рисунком и div-ом только на строгом Doctype.

maasja · October 22, 2011

Здравствуйте. Есть полностью валидный html-код:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Между рисунком и div-ом есть расстояние</title>

<style type="text/css">
	html,body {
		margin:0px;
		padding:0px;
		min-width:930px;
		width:100%;
		height:100%;
	}
</style>
</head>

<body>
	<div style="width:183px;">
		<img src="1.gif" style="width:183px;height:20px;" alt=""/>
		<div style="background-color:red;width:183px;">тест</div>
	</div>
</body>
</html>

Во всех современных браузерах, между рисунком и блоком есть расстояние (5px почему-то). Что я только не пробовал, рисунок и блок писать в одну строку (а не в две), расставлять margin:0; white-space, и еще много чего, все равно расстояние между ними есть. Но это только касается строгого doctype (как html, так и xhtml).

Стоит только удалить или изменить doctype с строгого на переходной, расстояние между рисунком и div-ом пропадает. Можно кончено поставить для блока "margin: -5px;", но меня интересует почему такое происходит.

Еще проблема заключается в том - что я не могу использовать переходной doctype, не потому что я любитель строгого и валидного кода, а потому что, то что я пишу, корректно работает во всех браузерах только если doctype strict.

Вот ссылка на рисунок что я использую (на всякий случай).

Объясните мне этот феномен пожалуйста. Спасибо.

Вот ссылка на пример http://jsfiddle.net/w7A7D/ .

mishka · October 22, 2011

http://forum.htmlbook.ru/index.php?showtopic=13589

maasja · October 22, 2011

mishka, БОЛЬШОЕ спасибо.

Интересно, почему такое проявляется только при строгом doctype?

SelenIT · October 22, 2011

Потому что всегда инлайновые по умолчанию картинки — главное (в теории единственное, но это не так, особенно в Опере), чем браузеры жертвуют в угоду тёмному прошлому в "почти стандартном" режиме. А сам факт наличия таких жертв — на мой взгляд, достаточное основание для полного отказа от transitional-доктайпов)

maasja · October 23, 2011

Теперь все понял! Громадное спасибо!

Sign In

Расстояние между рисунком и div-ом только на строгом Doctype.

Question

maasja

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

mishka

Link to comment

Share on other sites

maasja

Link to comment

Share on other sites

SelenIT

Link to comment

Share on other sites

maasja

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information