Обхватить картинку
Привет.
<table height="131" border="1" cellpadding="5" cellspacing="0"> <tr><td width="257" align="center" valign="middle"> <div style="background-color:#0066FF; padding:3px; "><a href=""> <img src="img/plus.gif" width="23" height="23"></a></div></td> </tr></table> Имею большую ячейку таблицы и в ней посередине - картинка ( разных размеров вставляется). Задача - сделать рамку картинке по onMouseOver. Свойством borderWidth картинки не могу манипулировать, т.к. картинка обернута в ссылку со всеми этими последствиями. Div по ширине растягивается . Решил только обертыванием картинки в таблицу с одной ячейкой, но много получается html. Что-то есть лучше? Может с дивом как-то? Спасибо. |
CSS:
a:hover img { border: 10px solid #f00; } |
Octane, в IE6 hover не пашет.
|
Для ссылок работает.
|
Цитата:
<style type="text/css"> a:hover img { border: 10px solid #f00; } </style> ... <a href=""><img src="img/tir0.gif" width="113" height="70"></a> В Opera и Mozilla все ОК, а в IE6 не появляется рамка. Что делаю не так? |
<style type="text/css"> a:hover { zoom: 1; } a:hover img { border: 10px solid #f00; } </style> ... <a href="#"><img src="img/tir0.gif" width="113" height="70"></a>Только не надо щас говорить, какой плохой ИЕ6 и когда он наконец умрет. Все эти баги давно описаны, и если половина хабра их не знает, то это их проблема. * Хабр здесь упомянут, как наибольшее сборище нытиков о ИЕ6. |
Kolyaj, спасибо за информацию, буду знать. Да, так работает, но
изначально не хотел с ссылками, т.к. даже так - проблема. При наведении курсора граница добавляется, а при убирании - исчезает - в итоге картинка дергается (и с ней вся верстка), а я хочу чтобы обертка находилась вокруг картинки и только цвет меняла. Остаюсь пока со своей табличкой... P.S. На хабрах не бывали - какие-то они чудные - статью мол пиши.:) |
Цитата:
|
Если написать
a { border: 10px solid black; } то работает как span - не вокруг картинки обводит. Может есть a:Антиhover {} :) |
Цитата:
|
Часовой пояс GMT +3, время: 14:42. |