Проблема со стилем в ссылке

[okunev2]

есть код:

.menu-header li {float: left; margin: 0 28px 0 0;}
.menu-header li a {font: bold 13px 'PT Sans'; display: block; height: 15px; text-transform: uppercase; color: #352530; text-decoration: none; text-decoration: none !important; background: url('./images/dot1.gif') repeat-x bottom left;}
.menu-header li a:hover {color: #faa000; text-decoration: none !important; text-decoration: none !important; background: url('./images/dot2.gif') repeat-x bottom left;}
.menu-header li a.active {color: #faa000; text-decoration: none !important; text-decoration: none !important; background: url('./images/dot2.gif') repeat-x bottom left;}

<ul>
<li><a href="#" class="active">Меню</a></li>
<li><a href="#">Меню</a></li>
<li><a href="#">Меню</a></li>
<li><a href="#">Меню</a></li>
</ul>

вот суть проблемы, в IE нижнее подчеркивание ссылки "прилепляется к словам", в остальных браузерах все нормально:

Подскажите как решить проблему в IE чтобы также выглядело как в остальных браузерах?

[dostel1]

Запара еще та!!

На крайняк если что, можно фон для ie поднять

*background: url('./images/dot2.gif') repeat-x 90%/*подбирай*/ left;

Интересно будет услышать решение.Это что получается высота в ишаке другая??

Edited December 20, 2011 by dostel1

[ShumNo]

подчеркивание я так понимаю делается с помощью картинки

background: url('./images/dot1.gif') repeat-x bottom left;

?

А за чем так? И не плохо бы было указать какой именно "ИЕ"

[Gaspode]

Подскажите как решить проблему в IE чтобы также выглядело как в остальных браузерах?

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

[hedgehog]

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

+1. Но если хочется поизвращаться, можно еще попробовать добавить line-height для ссылки со значением 15px или больше.

PS: куча !important до добра не доведет

Edited December 21, 2011 by hedgehog

[okunev2]

подчеркивание я так понимаю делается с помощью картинки

background: url('./images/dot1.gif') repeat-x bottom left;

?

А за чем так? И не плохо бы было указать какой именно "ИЕ"

все версии IE

Подскажите как решить проблему в IE чтобы также выглядело как в остальных браузерах?

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

дизайнер оказался умным ... и здесь стандартным ни как

Решение знаю есть, но не могу вспомнить

[hedgehog]

дизайнер оказался умным ... и здесь стандартным ни как

Решение знаю есть, но не могу вспомнить

Судя по скриншоту, в ИЕ текст в ссылке выравнивается по нижней границе, а не располагается посередине. Всего-то нужно выровнять посередине текст

Edited December 21, 2011 by hedgehog

[okunev2]

Судя по скриншоту, в ИЕ текст в ссылке выравнивается по нижней границе, а не располагается посередине

вернее он выравнивается по нижнему краю.

[hedgehog]

вернее он выравнивается по нижнему краю.

Это не работает?

a {line-height: 15px;}

[okunev2]

вернее он выравнивается по нижнему краю.

Это не работает?

a {line-height: 15px;}

нет

[Gaspode]

Сделайте втык дизайнеру, плюньте на его "задумку" и сделайте через border-bottom dotted.

[hedgehog]

Странно, у меня в ИЕ8 так же, как в опере:

http://i.imgur.com/V583z.png

http://jsfiddle.net/bLpgd/

Edited December 21, 2011 by hedgehog

[DImas95]

Может быть border-bottom для ссылок применить, будет немного отличаться по виду но прилепьляться небудет