Menu bar font changes

  • Author
  • #1916582

    Hi, I have the Twenty-Ten theme with a Custom Design upgrade. How can I use CSS to modify the size of the fonts in my main menu (under the banner image? Currently, they’re tied in to the Headings fonts – when I change the Heading font, the menu font changes with them. But I would like a different font size/style for the menu headings (to be precise, I want to make them a little smaller, so I can get all the menu items on one line).
    Any help would be much appreciated.
    Many thanks

    The blog I need help with is




    In the place where you’re allowed to put your css, try:

    #access .menu-header, {
        font-size: 13px;

    That should take it down 1px in size from its current 14px. See if that works.

    Did you say you also wanted to change the font style?


    To modify the font size for main menu items in the Twenty Ten theme, add this to your Appearance > Customize > CSS editor:

    #access a {
    	font-size: 80%;

    Adjust the 80% value as needed.

    You might also like:


    Many thanks to both of you

    This code worked well:
    #access a {
    font-size: 80%;

    I found I could use a px size or percentage – both worked. Yes, I did want to do other changes, but found the w3schools page at
    helpful. I was able to change the font weight and size, for example:

    #access a {
    font-size: 13px;
    font-weight: bold;
    font-family: Arial;
    Problem now solved, so thanks for your advice.

The topic ‘Menu bar font changes’ is closed to new replies.