Coder Perfect

An A tag’s width and height can be set.

Problem

Is it feasible to specify the width and height of an anchor tag in pixels? I’d want to have a backdrop image for the anchor tag while keeping the text inside the anchor.

Asked by Luke

Solution #1

The width and height parameters will be accepted if you declare your anchor display: block or display: inline-block.

Answered by Jared

Solution #2

Display: inline-block is another option. The benefit is that it will set the height and width like a block element, but it will also set it inline such that another a tag can sit directly next to it, allowing the parent space.

More information on display properties can be found here.

Answered by sarcastyx

Solution #3

Unless you put the anchors inside a UL list, none of these suggestions work.

<ul>
    <li>
        <a>click me</a>>
    </li>
</ul>

In the Chrome browser, sheet rules are overridden. The width is set to auto. Then you’ll need to apply inline CSS rules to the anchor itself.

Answered by Bradley

Solution #4

Although it isn’t an identical duplication (as far as I can tell), this is a typical issue.

display:block is what you need. However, you should read the specification to see why.

Answered by zzzzBov

Solution #5

Working for me is listed below.

display: block;
width: 100%;

Answered by Pankaj Upadhyay

Post is based on https://stackoverflow.com/questions/4743254/setting-a-width-and-height-on-an-a-tag