Menu help on Matala theme

  • Author
  • #883428

    Hi there,

    On my blog Inked in Colour, the menu from the Matala theme has a background and the actual text of the menu is not in a straight line because of the design. I would like to straighten it out and change the background for each element of the menu, is that possible? Alternatively create a block colour background for the entire menu would work also…

    Any assistance would be greatly appreciated.


    The blog I need help with is



    The blog linked to your username is wearing the Structure theme. Will you please post an active link to the blog wearing the Matala theme? Also note the forum threads on the Matala theme may contain your answer.


    I have searched other forum threads and none contain the answer I am looking for. One thread says you can’t do it, but I know you can cos I have seen other blogs who have fixed the problem, I just can’t figure out how to do it, so I”m really looking for someone with the know-how to show me how it’s done!

    The blog is

    Thank you so much for your time.



    Oh I should note that I have figured out how to colour the background if I want the same background for all menu items… the main issue is un-skewing the text so that the menu is in a straight line across the top instead of being all skewy and shorter – ifykwim.


    Still really hoping someone can help me out with un-skewing the text on the navigation menu and stretching it across the top in a straight line… Anyone?


    The main issue is un-skewing the text so that the menu is in a straight line across the top instead of being all skewy and shorter – ifykwim.

    This description is awesome. :)

    Here’s how to unskew the main menu in Matala:

    #access ul {
    	-webkit-transform: none;
    	-moz-transform: none;

    I found it by looking in the “Main Navigation” section of the original Matala stylesheet:


    If you also want to make the main navigation full width, try adding this:

    #access {
    	width: 100%;

    I would like to change the background for each element of the menu.

    To do this, you will need to look at the generated HTML code for your site and find the menu and copy down the menu class names for each element. Here is an example:

    #menu-item-59 {
    	background: url( repeat;

    You can change out the url() value to your own image and adjust the background repeat value to “no-repeat” if you want the image to appear only once.

    Here is a reference showing how the background property works and what values it accepts:


    agh!!! awesome. Thank you so much! The text still seems to be a bit skewy, not the line but the actual font itself, any ideas? Regardless though it looks much better. i’ll start having a look at the backgrounds now. thank you so much for your help… they said it couldn’t be done, but it can!

    awesome advice, as always


    I don’t think the text looks skewy at all after that last update you made. Do you mean that the top navigation font still looks tilted to you? If not, what do you mean when you say it still seems to be a bit skewy?

    I love how your site is shaping up!


    oh, thanks, it’s taking ages – working only in the dead of night when the baby is asleep! Yeah I mean the font looks a bit tilted… :) obviously my explanation on that one wasn’t very clear.



    Keep up the awesome work!… when you have the time that is.

    I checked again and the menu really doesn’t look tilted to me! I checked it in a bunch of browsers, including IE8. Would you mind force refreshing the page to double check it? If it still looks tilted, may I ask what browser version are you using?


    Maybe I’m just going crazy? :P Don’t worry about it! it looks fine this way, I’ll have a play around with the backgrounds and things in the next few days and we’ll see if that makes a difference!

    Thanks for your help!


    Okay! I’m keeping an eye on

    I love the way it’s shaping up.

The topic ‘Menu help on Matala theme’ is closed to new replies.