Skip navigation
Currently Being Moderated

How to use Rosewood Std and Rosewood Std Fill with CSS

Oct 2, 2012 11:12 AM



I'm trying to figure out how to get Rosewood and Rosewood Fill typeface to work correctly in a web page.


I'm a Typekit subscriber they didn't have any advice to give me other than to tweak it in CSS, so I did. But, I now notice that the Fill typeface doesn't fill Rosewood 100% as it should. i don't don't own Rosewood Fill so I can't play with it in Illustrator.


Below is a .PNG file showing what I have now along with the CSS. The HTML is simple, the text is in two <p>'s. You can see how Fill is a couple of pixels off. I've tried 'font-weight: bold;' and '700' to get the browser to beef up the font but it didn't work.




para-top {

    position: relative;

    z-index: 2;

    top: 128px;

    left: 50px;

    font: 6rem/1 "rosewood-std",sans-serif;

    color: #000;



.para-bottom {

    position: relative;

    z-index: 1;

    bottom: 67px;

    left: 50px;

    font: 6rem/1 "rosewood-std-fill",sans-serif;

    font-weight: bold;

    color: red;




Eric Miner


More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points