Убрать отступы между картинками

[alenkins]

Добрый день. Подскажите пожалуйста, как убрать отступы примерно в 2px между картинками, расположенными в одном div-е. Общая ширина четырех картинок в сумме 664px. По идее картинки должны располагаться одной строкой без отступов. Но последняя уходит вниз и между всеми появляется совершенно ненужный горизонтальный отступ в несколько пиксел.

<div class="mainmenu">

<a href=""><img src="images/about.png" alt="" /></a>

<a href=""><img src="images/serve.png" alt="" /></a>

<a href=""><img src="images/offer.png" alt="" /></a>

<a href=""><img src="images/course.png" alt="" /></a>

</div>

div.mainmenu {

position:relative;

padding:0;

width:664px;

height:41px;

top:60px;

left:0;

float:left;

}

img {

border:0;

margin:0;

padding:0;

}

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

[Энди]

img {

border:0;

margin:0;

padding:0;

}

вот суда добавь float:left;

[s0rr0w]

Добрый день. Подскажите пожалуйста, как убрать отступы примерно в 2px между картинками, расположенными в одном div-е. Общая ширина четырех картинок в сумме 664px. По идее картинки должны располагаться одной строкой без отступов. Но последняя уходит вниз и между всеми появляется совершенно ненужный горизонтальный отступ в несколько пиксел.

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

Если бы вы читали хоть одну документацию по HTML, то там бы вы нашли следующее правило, что все пробелы, переводы строк, табуляция превращаются в один пробел.

[Энди]

Если бы вы читали хоть одну документацию по HTML, то там бы вы нашли следующее правило, что все пробелы, переводы строк, табуляция превращаются в один пробел.

та не в этом дело,а в том што выравнивание задал диву,а не изображениям,вот они и не двигались.А вопще у него странный метод))помоему оч много лишнего.

Edited March 26, 2010 by Энди

[s0rr0w]

та не в этом дело,а в том што выравнивание задал диву,а не изображениям,вот они и не двигались.А вопще у него странный метод))помоему оч много лишнего.

Если убрать между <img> пробелы и переводы строки, то все будет работать и так.

[Энди]

Если убрать между <img> пробелы и переводы строки, то все будет работать и так.

не буду спорить,но про какие пробелы и переводы непойму.)

[s0rr0w]

не буду спорить,но про какие пробелы и переводы непойму.)

<img><img> <= без пробелов

<img>

<img> <= с пробелами

[alenkins]

Энди, спасибо большое. Помогло а что по-Вашему там лишнее? Буду благодарна за консультацию ))

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

[Энди]

вот и хорошо.ну я писал вот так

div.mainmenu {

float:left;

padding:0;

}

img {

float:left;

border:0;

margin:0;

}

<img><img> <= без пробелов

<img>

<img> <= с пробелами

блин.учился я на гафический дизайн в академии,ни одной литературы не читал,и не один препод говорил што пробелы это все г...)))неимеют значения!!!и я согласен.

<a href=""> <img src ="button3.jpg" alt="" /></a>

<a href=""><img src ="button3.jpg" alt="" /></a>

<a href=""> <img src ="button3.jpg" alt="" /></a>

<a href=""> <img src = " button3.jpg" alt ="" /></a>

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

Edited March 26, 2010 by Энди

[alenkins]

В данном случае очень принципиально позиционирование. В документе много блоков, их нужно расположить именно так, а не иначе

Размер блока указывала, когда картинки поплыли и не получалось это исправить...

Паддинг в изображениях, это я что-то да, протупила...

В любом случае спасибо!

[Энди]

В данном случае очень принципиально позиционирование. В документе много блоков, их нужно расположить именно так, а не иначе

Размер блока указывала, когда картинки поплыли и не получалось это исправить...

Паддинг в изображениях, это я что-то да, протупила...

В любом случае спасибо!

Незашто)))

[mishka]

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

Странно!

Картинка инлайновый элемент, поэтому если есть пробелы/переводы то отступ будет, если убрать пробелы/переводы, то отступа не будет!

s0rr0w, все правильно подсказал. Скорее вы всего чтото неправильно делаете.

img {

float:left;

border:0;

margin:0;

}

Скоро опять прийдете сюда с вопросом "почему на сайте все валится?"

Ненадо глобально картинки флотать!

У картинки нет маргина, достаточно бордер обнулить.

[psywalker]

s0rr0w Однозначно прав, это известная тема.

Ради интереса посмотрите мои примеры:

1)

<!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>Документ без названия</title>
<style type="text/css">
	li { display: inline; border: 1px solid #000;}
</style>
</head>

<body>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
	</ul>
</body>
</html>

И сравните его с:

2)

<!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>Документ без названия</title>
<style type="text/css">
	li { display: inline; border: 1px solid #000;}
</style>
</head>

<body>
	<ul>
		<li>1</li><!--
		--><li>2</li><!--
		--><li>3</li><!--
		--><li>4</li>
	</ul>
</body>
</html>

Во последнем примере я закоментил именно пробелы, как-бы соединив элементы списка, а в первом примере они есть. И сами сравните результаты.

[Энди]

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

Скоро опять прийдете сюда с вопросом "почему на сайте все валится?"

Ненадо глобально картинки флотать!

У картинки нет маргина, достаточно бордер обнулить.

про margin непомню нужен ли он был,может вступил)бордер писал тошто после,а на щет сайта,у меня ничего не валитса.