[html] Setting a width and height on an A tag

Is it possible to set the width and height in pixels on an anchor tag? I'd like to have the anchor tag to have a background image while retaining the text inside the anchor.

li {_x000D_
  width: 32px;_x000D_
  height: 32px;_x000D_
  background-color: orange;_x000D_
}_x000D_
_x000D_
li a {_x000D_
  width: 32px;_x000D_
  height: 32px;_x000D_
  background-color: red;_x000D_
}

<li><a href="#">Something</a></li>

You can also use display: inline-block. The advantage of this is that it will set the height and width like a block element but also set it inline so that you can have another a tag sitting right next to it, permitting the parent space.

You can find out more about display properties here

Below working for me

display: block;
width: 100%;

All these suggestions work unless you put the anchors inside an UL list.

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

Then any cascade style sheet rules are overridden in the Chrome browser. The width becomes auto. Then you must use inline CSS rules directly on the anchor itself.

It's not an exact duplicate (so far as I can find), but this is a common problem.

display:block is what you need. but you should read the spec to understand why.