What does "a" stand for in font: 0/0 a;

css font-size shorthand
Mr. Alien picture Mr. Alien · Dec 17, 2013 · Viewed 10.2k times · Source

I was referring a video tutorial where the designer used font: 0/0 a; for image replacement, so I get that 0 is the font-size, another 0 is the line-height but designer skips the a part just by saying that's an hack.

So what does that a exactly do there?

Answer

isherwood picture isherwood · Dec 17, 2013

http://nicolasgallagher.com/another-css-image-replacement-technique/

font:0/0 a – a shorthand property that zeros out the font size and line-height. The a value acts as a very short font-family (an idea taken from the BEM implementation of this method). The CSS validator complains that using 0/0 in the shorthand font property is not valid, but every browser accepts it and this appears to be an error in the validator. Using font:0px/0 a passes validation but it displayed as font:0/0 a in the code that the validator flags as valid.

Related questions

Font scaling based on width of container

I'm having a hard time getting my head around font scaling. I currently have a website with a body font-size of 100%. 100% of what though? This seems to compute out at 16 pixels. I was under the impression that 100% would somehow refer …

Read More
Responsive font size in CSS

I've created a site using the Zurb Foundation 3 grid. Each page has a large h1: When I resize the browser to mobile size the large font doesn't adjust and causes the browser to include a horizontal scroll to accommodate for …

Read More
How can I change the font-size of a select option?

I am trying to style a select option dropdown list. Is it possible to make the font-sizes of the options different from the default value? For example, the default: -- Select Country -- Would be size 7pt; and one of …

Read More