I got some problems with line-height in Firefox & Opera.
I am gonna provide you with some pictures,
Safari & Chrome (Webkit)
as you can see it looks fine, it follows the baseline grid pretty perfect.
Now its starting to get nasty, the text jumps up a few pixles making everything look awful.
And Opera looks pretty much the same as Firefox, except it pushes the <h1> (FELIX) up even more.
So I’m guessing that firefox and opera handles line-height slightly diffrent, can you get around this with some type of hack?
To clear some things up, the layout follows a 24px high grid,
Code used to wrap the logotype
Code used for <h1>FELIX</h1>
Code used for <h2>THOUGHTS & WORK</h2>
update: could this be because im using PX’s instead of EM’s?
All I can add is that most examples of typographic grids use em’s so maybe try using those.
It just looks like Webkit and Mozilla/Presto render the line-height of font’s in a different way.
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".