Link Height in FF

[PrateekSaxena]

Hello,I am writing the following CSS code -

a.menu{	width: 60px;	font-family: Tahoma;	font-size: 14px;	background-color: red;	height: 60px;}

But in Firefox the link is not stretching to the height and width I have told it to. Instead the background color only remains till the text of the link. Could someone please tell me how I can fix this. This is the HTML code

<a class="menu" href="#">Me</a>

I am using Firefox Ver 2.0.0.1.

[roondog]

try line-height:60px; i think that'll do it.In fact that is a bad suggestion. Just had a look at some of my links and they seem to be ok with just height and width as you have put them. maybe put the links into a <ul> call it #nav or something and use #nav a {} in the css. As seen here

[Rantzien]

I think you will need to set display:block; or display:inline-block; on the link to be able to change it's height.

[croatiankid]

it's not a problem with firefox. you should take a look at this.

The W3C's CSS2 spec states that for Inline, non-replaced elements, the 'height' property doesn't apply, but the height of the box is given by the 'line-height' property.

[roondog]

it's not a problem with firefox. you should take a look at this.

So i was right wow thats a first. Alternatively you could make a div called link, give it all the properties and just put the link inside that.

[PrateekSaxena]

Thanks guys..that was really helpful

[croatiankid]

So i was right wow thats a first. Alternatively you could make a div called link, give it all the properties and just put the link inside that.

That would be semantically incorrect. Try setting the link via CSS to display:block;