If you want a link to cover an entire div
, an idea would be to create an empty <a>
tag as the first child:
<div class="covered-div">
<a class="cover-link" href="/my-link"></a>
<!-- other content as usual -->
</div>
div.covered-div {
position: relative;
}
a.cover-link {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
This works especially great when using <ul>
to create block sections or slideshows and you want the whole slide to be a link (instead of simply the text on the slide). In the case of an <li>
it’s not valid to wrap it with an <a>
so you’d have to put the cover link inside the item and use CSS to expand it over the entire <li>
block.
Revisions
- June 6, 2022 @ 17:40:18 [Current Revision] by Sharing Solution
- June 6, 2022 @ 17:40:18 by Sharing Solution
No comments yet.