html - Applying CSS transform rotation to an element using @font-face -
i've been trying apply transform rule elements have @font-face
font applied them.
h1 { -webkit-transform: rotate(-1deg); -moz-transform: rotate(-1deg); -o-transform: rotate(-1deg); transform: rotate(-1deg); }
when transform rule applied, rotation i'm after, text not appear correctly — although it's rotated, it's though each character bound origin sits on pixel, , line of text looks jagged.
if replace font system font, problem goes away, appear related use of @font-face
. i've tested in variety of browsers on os x , windows, , show similar results.
has come across problem before, or can give advice on why might occurring?
check out source experiment.
it uses @font-face rotate other nifty css3 effects.
Comments
Post a Comment