Кофейник

Просто задай изображению атрибут style="margin:0 15px 10px 15px"

Самое дешёвое и сердитое решение.

Кофейник добавил 17.11.2009 в 20:15

Какой к чертям собачьим паддинг?

К чему внутренний отступ?

Ок, сейчас сейчас в вики посмотрим, подробнее. ewg777, спасибо. ;)

Камрады, а расшифруйте для тупого, что такое ДЦ? Просто интересно очень. ;)

Что там не фиксится? Выкладывай скрин.

Попробуй через conditional comments для IE7 её пофиксить. У меня в IE7 всё нормально было.

Кофейник добавил 17.11.2009 в 20:03

Меньше всего вероятность того, что это из-за вёрстки если ты сделал так как я сказал. Т.к вкладка позиционируется абсолютно, т.е мы вырвали её из потока. Скорее всего это выкрутас IE, который я не доглядел. Выкладывай скрин посмотрим. ;)

Какой смысл то в этом? Никакого. Даже не смешно.

Нет. Не кончились.

Ну вот камрад: http://kg-am.com/test.html

Тут всё должно как надо работать. :)

Для ИЕ6 сам костыли поставишь или помочь? ;)

Код на всякий:

<!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">
ul{width:400px;list-style:none;}
li{
height:23px;
margin:15px 0 15px 0;
position:relative;}
a{color:#b8b8b8;text-decoration:none;
margin-left:15px;}

div{background:url(flower.png) no-repeat;
width:0;height:63px;
position:absolute;
top:-21px;right:0;}

li:hover{background:#fc97a3;}

li:hover div{width:67px;}

li:hover a{color:#fff;}
</style>
</head>
<body>
<ul>
<li><a href="#">List item 1</a><div></div></li>
<li><a href="#">List item 2</a><div></div></li>
<li><a href="#">List item 3</a><div></div></li>
<li><a href="#">List item 4</a><div></div></li>
<li><a href="#">List item 5</a><div></div></li>
<li><a href="#">List item 6</a><div></div></li>
</ul>
</body>
</html>

Тааак... ну MrBernz, спасибо тебе, подогнал интересную задачку, почаще бы так. :)

Вот пока только так решить смог: http://kg-am.com/test.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>Тест</title>
<style type="text/css">
ul{width:400px;list-style:none;}
a{color:#8b8b8b;text-decoration:none;}
li{padding:2px 15px;margin:30px;
position:relative;}
li:hover{background:#fd97a4;}
li:hover a{color:#fff;}
li div{background:url(flower.png) no-repeat;
height:52px;width:0px;
position:absolute;right:0;top:-12px;}
li:hover div{width:55px;}
</style>
</head>
<body>
<ul>
<li><a href="#">List item 1</a><div></div></li>
<li><a href="#">List item 2</a><div></div></li>
<li><a href="#">List item 3</a><div></div></li>
</ul>
</body>
</html>

Кофейник добавил 17.11.2009 в 18:55

Выложи если не трудно этот цветочек в .png с прозрачным фоном. ;)

В чём проблема то?

Просто выносите его прямо перед </body> вот и всё.

И зачем тут jQ?

Как там ТС, разобрался? :)