3

I'm in need of help. I've search the web for the answer but the answer i found didn't work.

I'm trying to display the content of the a in a box above the a "a:before", and then display the same text as in the a, and i've done that with 

content:attr(title);

But it wont vertical align. i've tried with

display:table-cell;
vertical-align:center;

http://jsfiddle.net/CvZkX/

It dosn't work. Anybody knows how it's done?

Best Regards Mats

MyRevenge
  • 117
  • 1
  • 14

1 Answers1

4

For a single line of text, the easiest solution is to use line-height.

http://jsfiddle.net/thirtydot/CvZkX/1/

header nav a:before {
    line-height: 2.3em;
}

I chose 2.3em because you have .5em + .5em + 1.7em (padding-top + padding-bottom + font-size), and we're trying to set the line-height equal to the height of the element.

thirtydot
  • 224,678
  • 48
  • 389
  • 349