Форум Сайтостроение Веб-строительство

Проблема с версткой, при наведении на ссылку подчеркивается картинка в теге <a>

12
IM
На сайте с 29.10.2010
Offline
92
IndigoMan
2001

Как сделать чтобы текст подчеркивался, а картинка - нет?

Можно конечно сделать вот так: 

<a href .. ><img></a>

<a href ..>ТЕКСТ>/a>

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

В таком варианте при наведении на ссылку она подчеркивается и сама картинка тоже, к тому же ей добавлен визуальный эффект чтобы при наведении менялся цвет границы и дополнительная полоса сильно мешает. 

<a href="#"><img src ... >Текст текст текст</a>



a {

text-decoration: none;

}

a:hover {

text-decoration: underline;

}

a img {

padding: 1px;

border: 1px solid #fff;	

}

a:hover img {

text-decoration: none;

padding: 1px;

border: 1px solid #ff707c;	

}

Причем подчеркивается она только в firefox ><

Видел такой же глюк когда ставил joomla + virtuemart

herbst
На сайте с 16.07.2010
Offline
70
herbst
#1

<a href="#" class="derklass">текст</a>

Для класса derklass пропишите размеры, сделайте изображение фоном, добавьте эффекты для наведения через a:hover.

Если я правильно понял задачу, то это хороший вариант )

IM
На сайте с 29.10.2010
Offline
92
IndigoMan
#2

Не хочется делать изображение фоном =\ Хочу чтобы изображение лежало рядом со ссылкой. =\

IndigoMan добавил 18.02.2011 в 01:39

Проблему решил добавлением такого док-тайпа:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

DZ
На сайте с 03.02.2011
Offline
2
DoctorZlo
#3

Правильный док-тайп - первый шаг на пути решения любой верстальческой проблемы.

G
На сайте с 12.04.2008
Offline
101
GSMtricks
#4

<img src=".. " border="0" alt="" /> вот поможет

Продажа сайтов (/ru/forum/866932) под Amazon и AdSense
Avenger
На сайте с 22.07.2007
Offline
47
Avenger
#5
DoctorZlo:
Правильный док-тайп - первый шаг на пути решения любой верстальческой проблемы.

Ага, если бы он только был правильным еще так вообще было бы отлично.

Сейчас смело можете использовать при верстке <!DOCTYPE HTML> - поддерживается всеми браузерами и не переводит IE в quirks mode.

С уважением, Андрей Головнев (http://golovnev.by/)
IM
На сайте с 29.10.2010
Offline
92
IndigoMan
#6
GSMtricks:
<img src=".. " border="0" alt="" /> вот поможет

Вы вообще тему читали?

G
На сайте с 12.04.2008
Offline
101
GSMtricks
#7

Читал, задача сдедлать что бы картинка не подчеркивалась при наведении ( ссылка ), я дал рабочий код.

IM
На сайте с 29.10.2010
Offline
92
IndigoMan
#8
GSMtricks:
Читал, задача сдедлать что бы картинка не подчеркивалась при наведении ( ссылка ), я дал рабочий код.

Код вы дали не рабочий, border=0 помогает не обводить картинку, а мне надо совсем другое, внимательнее читайте.

G
На сайте с 12.04.2008
Offline
101
GSMtricks
#9

Вы пробывали? border=0 даст то, что не будет подчеркивания. Дайте в личку свой конкретный пример. Или Ваш сайт укажите и я проверю.

IM
На сайте с 29.10.2010
Offline
92
IndigoMan
#10
GSMtricks:
Вы пробывали? border=0 даст то, что не будет подчеркивания. Дайте в личку свой конкретный пример. Или Ваш сайт укажите и я проверю.

Вы даже не поняли сути вопроса и все продолжаете со своим бордер=0, у меня оно стоит всегда по умолчанию, вопрос вообще НЕ ОБ ЭТОМ, зачем спорить если не понимаете?

Тем более что пример описан в 1м посте.

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий