ссылка 2 divs вместо текста

У меня есть несколько изображений, с изображением у меня есть ссылка (текст).ссылка 2 divs вместо текста

Тем не менее, я хочу, чтобы текст и изображение можно было щелкнуть, а не просто текст.

Это мой код: HTML:

<div id="testimage"> 
    <div id="a1"><a href="http://mja.co.uk/">Awards</a></div> 
</div>

(другое изображение):

<div id="testimage1"> 
    <div id="a2"><a href="http://mja.co.uk/Events">Events</a></div> 
</div>

CSS:

#testimage { 

    background-image: url(images/mja1.jpg);height: 205px;width: 322px; 
} 
#a1 a 
{position: absolute;font-size: 25px;color: #085da2;top: 503px;} 
#a1 a:hover 
{color:#085da2;opacity:0.5;}

, как вы можете видеть, что a1 имеет ссылку, однако Мне нужна ссылка на testimage тоже.

я попробовал:

HTML

<a href="http://mja.co.uk/Events"><div id="testimage"></div></a>

CSS

a{ display:block; }

с этим; когда я добавил 2-е изображение, вся страница начала выглядеть по-другому.

Так что я ищу, чтобы иметь ссылку для обоих div.

источник

2014-01-29 al123

я не могу попросить пойти сделать скрипку. Так что, пожалуйста, сделайте JSFiddle. – Ruddy

Это то, что вы ищете? [** DEMO **] (http://jsfiddle.net/Ruddy/ucz5S/) – Ruddy

Да, или, по крайней мере, показать полный HTML. И можете ли вы объяснить, для какой позиции: абсолютной, и почему вы не просто используете элементы img? –

Я думаю, что это то, что вам нужно.

<a href="http://mja.co.uk/Events"> 
    <img src="images/mja1.jpg"/> 
    <span id="a2">Events</span> 
</a>

источник

2014-01-29 12:39:30

a { display: inline-block } будет «расширить» кликабельную область ссылки на полный размер это содержащий элемент, в данном случае, в <div>, но держит макет.

источник

2014-01-29 12:45:55 mpdc

Просто обернуть DIV в теге ... <a href=""><div id="whatever">The text</div></a>

источник

2014-02-06 18:31:44

ссылка 2 divs вместо текста

ответ

Смежные вопросы