Is there a way to letter space or kern the type in the menus and titles?

• 

  amagraphicdesign · Member · Dec 10, 2013 at 2:28 am

  • Copy link
  • Add topic to favorites

  I would like to have the menu typography and subsequently the page title’s typography appear “letterspaced” (or kerned). Currently I have achieved this by adding a word space between characters but a double word space (between words) does not show up. How can I achieve a “loose” setting without the word spaces so that I can have actual word spaces between words?

  I have included a screen capture here: http://amagraphicdesign.com/menu-title-example/

  Notice the menu title and page title: G R A P H I C D E S I G N

  Is there a way to do this using CSS?

  The blog I need help with is: (visible only to logged in users)

• 

  gracejiyoung · Member · Dec 10, 2013 at 4:46 am

  • Copy link

  Hi there,

  I see that you have made edits to your CSS to accomplish this. If you still have questions please feel free to reach out!

  Please note that most of our CSS support is done in our community forums by both staff and volunteers:

  https://en.forums.wordpress.com/forum/css-customization

  When you create a CSS-related help request, please make sure to select or link to the WordPress.com blog you’re working on and include a clear description of the change you’re trying to make. It helps a lot.

  To learn more about how CSS editing works at WordPress.com, see this help page:

  http://en.support.wordpress.com/custom-design/editing-css/

  If you need to hire a consultant to help you with in-depth design work or large CSS revisions, please consider getting a quote from Tweaky:

  http://en.support.wordpress.com/customize-my-site/request-theme-customization/

• 

  amagraphicdesign · Member · Dec 10, 2013 at 9:07 am

  • Copy link

  Hi

  Thank you for taking a look but the CSS I added only spaced the menu column widths, not the words themselves. I think the appropriate term might be “tracking”. I’ve scoured the forums for kerning, letter spacing and tracking menu and title type but so far have had no luck. Is it even possible to do what I’m asking?

  I did find this article but it only refers to individual words or sentences in the content (versus menu and titles).

  Formatting text pt. 3: space between lines, characters, and words

  thank you for any light you may be able to shed on the subject.

• 

  gracejiyoung · Member · Dec 10, 2013 at 6:36 pm

  • Copy link

  Hi there,

  Sure! You can increase the letter-spacing of the page titles by adding this to your CSS:

  .wf-active h1 {
  letter-spacing: 0.3em;
  }

  You can change the 0.3 to your desire. You can increase or decrease it based on what you see in the Preview.

  You can change the top menu letter-spacing by adding this:

  .menu ul a {
  letter-spacing: 0.2em;
  }

  Again you can edit the numbers to your desire!

  Happy Blogging!

• 

  amagraphicdesign · Member · Dec 11, 2013 at 10:16 am

  • Copy link

  Thank you that worked perfectly.

  So now I need to take this one step further…

  Is there a way in both the menu and page titles to specify the tracking amount to an individual word? Or is there a way to specify that “all caps” words space differently than” caps and lower case”?

  I tried to apply the CSS code in the quick edit title box but it did nothing.

  Thanks again for your time

  a.ma

• 

  gracejiyoung · Member · Dec 11, 2013 at 6:54 pm

  • Copy link

  Hi there,

  I’m actually not quite sure about this. You can post in our CSS forums and they might be able to give you a better answer:

  https://en.forums.wordpress.com/forum/css-customization

• 

  amagraphicdesign · Member · Dec 11, 2013 at 8:57 pm

  • Copy link

  Hi Grace,

  thank you so much…i’ll keep on trying.

  I thought this Q&A was in the forums? Do I need to make this public? and how do I do that?

  thanks again!

• 

  gracejiyoung · Member · Dec 11, 2013 at 9:49 pm

  • Copy link

  Hi there,

  We have a separate forum for CSS specifically. :)

  https://en.forums.wordpress.com/forum/css-customization

  We have amazing volunteers and staff there who’d love to help you with more specific CSS questions!

  Happy Holidays!