IE8 и padding для ссылки

Саныч · August 26, 2010

Столкнулся с такой проблемкой. Есть ссылка, т.е. http://' target="_blank"> и к ней стили

color: #2b587a;
padding: 1px 0 1px 18px;
background: url(../img/big_search.png) no-repeat;

в опере, мозиле все как надо отображаеться, в осле криво (см. скрин)

Собственно вопрос, неужели осел не понимает свойство padding для элементов а?

Edited August 26, 2010 by Саныч

Great Rash · August 26, 2010

Все он понимает.

<!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" lang="ru">

<head>
	<title>An XHTML 1.0 Strict standard template</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />

	<style type="text/css">
		* {
			margin: 0;
			padding: 0;
		}

		html {
			font-size: 100.1%;
		}

		body {
			font: 62.5% 'Trebuchet MS', Arial, Tahoma, Verdana, sans-serif;
		}

		html,
		body {
			height: 100%;
		}

		a {
			color: #2b587a;
			padding-left: 18px;
			background: url('http://www.iconsearch.ru/uploads/icons/silk2/16x16/magnifier.png') 0 50% no-repeat;
		}
	</style>

	<script type="text/javascript">

	</script>
</head>

<body>

	<a href="#">text link text</a>

</body>
</html>

В том что вы пишете padding: 1px 0 1px 18px; никакого смысла нет, т.к. padding сверху и снизу понимается только если элемент блочный.

Саныч · August 26, 2010

Не стоит считать себя самым умным... 1 пиксел снизу и сверху я добавил не просто так... Фоновое изображение размером 16х16. Если не выставлять верхний и нижний отступ, то кусок изображения (те самые 2 пиксела) срезаются...

0 50% ничего не дает... Я не могу понять, почему осел не понимает левый отступ.

Саныч · August 26, 2010

Тему можно закрыть. Сам нашел ошибку...

Стили были объявлены так

div.film_mini_stat > p:last-child > a,
div.film_top_rating > p > a,
div.film_top_new > p > a,
div.film_top_comments > p > a,
div.film_search > p > a {
	color: #2b587a;
	padding: 1px 0px 1px 18px;
}

и из-за last-child осел этот блок просто игорировал...

Edited August 26, 2010 by Саныч

mishka · August 26, 2010

:last-child нету такого в css 2.1 - соответственно ие8 его непонимает

есть :first-child

P.S. паддинги вверху и внизу нормально понимаются инлайновыми элементами. Конечно вертикальных отступов они не дают, но зато не обрезается бг, и это здорово )).

Edited August 26, 2010 by mishka2

Sign In

IE8 и padding для ссылки

Question

Саныч

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

Great Rash

Link to comment

Share on other sites

Саныч

Link to comment

Share on other sites

Саныч

Link to comment

Share on other sites

mishka

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information