Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Setting a width and height on an A tag

People also ask

How do you change the height and width of a tag?

You need to make your anchor display: block or display: inline-block; and then it will accept the width and height values.

How do you give a tag a width?

You can redefine it as a block element and then set width to it: a{display:block;width:400px} .

How do you increase the size of a tag?

To change the font size in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <p> tag, with the CSS property font-size. HTML5 do not support the <font> tag, so the CSS style is used to add font size.

How do you change the width of a link in HTML?

You can't set the width and height of inline elements. You would have to set display: block on the a , but that will bring other problems because the links start behaving like block elements. The most common cure to that is giving them float: left so they line up side by side anyway.


You need to make your anchor display: block or display: inline-block; and then it will accept the width and height values.


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


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.