Борюсь с css и IE. Help, pls.

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

Делал так:
у img прописывал стиль

Код:

img {border: 1px solid #00FF00;}   img:hover {border: 1px solid #FF0000;}

получал то, что хотел, но только в опере и фф, эксплорер показывать, как надо, отказывался. Прымер.

На одной страничке подглядел было сделано так:
прописан класс:

Код:

.ramka: img {border: 1px solid #0F0;}   .ramka:link img {border: 1px solid #0F0;}   .ramka:visited img {border: 1px solid #0F0;}   .ramka:hover img {border: 1px solid #F00;}

В таком виде опять в ие не работало, а в опере обрамлялись сразу обе. Не подходит. Но вопрос номер раз: Почему не появляется постоянное зеленое обрамление, если убрать строчку

Код:

.ramka:visited img {border: 1px solid #0F0;}

?
Жмяк. Вторая строчка влияния не оказывает, а я изначально считал необходимыми только 1ю и 4ю...

Вобщем, потом я заметил, что еще имеется такой стиль для ссылок:

Код:

.ramka:hover{color:#F00;}

и с ним в эксплорере все работает. Вопрос номер 2: Почему так? Я считал, что внутренние стили главнее внешних..

Ну и вопрос 3: Можно ли все-таки как-то добиться, чтобы в эксплорере работал первый вариант (который работает в опере и фф), не делая отдельной ссылки на каждую картинку?

Это все оттого, что уебищный ИЕ понимает псевдокласс hover только для ссылок, в отличие от других браузеров, которые отлично применяют его к любому элементу (как и должно быть). Поэтому если картинка внутри ссылки, то и стиль надо соответствующим образом записывать.

нужно писать a:hover img {} или img a:hover если не ошибаюсь

Цитата:

не делая отдельной ссылки на каждую картинку?

яваскриптом

samedi писал:

нужно писать a:hover img {} или img a:hover если не ошибаюсь

50/50.
То есть "или" совсем зря, как ты представляешь себе ссылку внутри картинки? Правильный только первый вариант, а второй просто бесмысленный набор правил.