Search code examples
htmlwidthanchor

How to do I get an anchor tag to fill the width of a table cell?


I have a table cell with an anchor tag and I want the width (and height) of the anchor tag to fill the width of the containing table cell. Intuition doesn't seem to work on this. Please help.

HTML:

<table>
    <tr>
        <td class="width_is_100px">
            <a href="http://www.doesnotwork.com"><span class="make_width_100px">Some Text</span></a>
        </td>
    </tr>
</table>

CSS: (doesn't work)

.make_width_100px {
    width:100px !important;
}

The anchor tag is only as wide as the text "Some Text". I want the user to be able to click anywhere inside the table cell and trigger the link. No javascript please.


Solution

  • Try it:

    a {
        display: block;
        height: 100%;        
        width: 100%;
    }