[SOLVED] Can I make space between menu items text the same?

moomum · #1 Aug 13, 2013, 09:50 AM

I'm working on this - http://www.awaremindtherapies.co.uk/
she just wanted it transferred from a HTML site to a wordpress one so it needs to look like it did originally.

I'm having problems getting spaces between the words on the menu the same.

At the moment the gap between Psycotherapy and Mindful Birthing looks smaller than the one between Mindful Birthing and Reiki.

I've been playing with the CSS, padding, margins etc but I'm not getting anywhere. Any pointers much appreciated.

And is it easy to get an image before each menu item too? Remember I am a fool and know nothing.

juggledad · #2 Aug 13, 2013, 10:43 AM

have you edited any of the themes files? particularly the css.php?

moomum · #3 Aug 13, 2013, 11:01 AM

not to my knowledge, just added to the css through the theme options

moomum · #4 Aug 13, 2013, 11:07 AM

I can see the menu bit on the css.php but I am way out of my depth, no idea what to start fiddling with here.

lmilesw · #5 Aug 13, 2013, 11:40 AM

You don't want to mess with css.php. Juggledad but it appears that someone may have set the width for the menus there.

The width of the menu items is set to 8em so you see more space around menu items that are shorter.

You could see what was changed in css.php or you could "overwrite" the rules with the following in the CSS Inserts section of the theme options.

HTML Code:

div#menu1 li {
    border: 1px solid white !important;
}
div#menu1 a {
    width: auto !important;
    margin: 0 30px !important;
    background: transparent !important;
    border: none !important;
}

moomum · #6 Aug 13, 2013, 12:02 PM

Larry you are a total star, that is exactly what I needed. Huge thanks!