Gwater17 Gwater17 - 5 months ago 17
CSS Question

Font value of a?

I'm going over the Shay Howe HTML/CSS tutorial and it includes the following example in codepen. http://codepen.io/shayhowe/pen/gblxy

I have no clue what the letter a means in the value for the font property. I would really appreciate it if someone can explain it to me.

HTML


  • Bold Text

  • Italicize Text

  • Underline Text

  • Size Text

  • Bullet Text

  • Number Text

  • Quote Text

  • Left Align Text

  • Center Align Text

  • Right Align Text



CSS

li span {
background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/29841/sprite.png") 0 0 no-repeat;
color: transparent;
display: block;
font: 0/0 a; */the a right here */
height: 16px;
width: 16px;
}

Answer

font: 0/0 a; - Is 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.

Comments