How do I adjust the space between main menu items?

[powersite]

I’ve been loading every new version of Weaver Extreme on a test server an playing with it when I had the chance, but I’m finally building an actual client website with it. I’m getting the hang of things pretty well, but I can’t figure out how to adjust the padding between the main menu items. 

I’ve looked through the help file and Forum and tried adding all kinds of CSS code and nothing is working for me.  The site is at http://powersite4.com/allair/.

An easy answer (like I just didn’t see the setting) would be greatly appreciated!

Kolleen Powers

[scrambler]

Add the rules below in Main options > menus > Primary menu bar > Item BG: CSS+ box

{padding-left:20px;padding-right:20px;}
.menu-hover.menu-arrows .has-submenu > a {padding-right:44px;}
.menu-arrows.menu-hover .toggle-submenu {margin-right:20px;} 

The first one changes the right left padding to 20px

The second adds the 20px to the existing 24px for the menu with sub menu arrow

The third shifts the arrow so the space is added right of the arrow

[powersite]

Thanks, Scrambler!  It worked like a charm!

BTW, this is a redesign where the client want the site to look just like his static html site, so I can’t take credit for the bad color scheme or the awful video, but I do know that any time I need to duplicate (as close as possible) a website, weaver is the only theme that gives me the control to do it. I currently have about 40 clients on the old Weaver II Pro theme.  It’s time to move on…

Thanks again for your your prompt and very clear help.

Kolleen

[Weaver]

@scrambler –

This rule doesn’t work right for the default menu with a default “Home” item on the left – there is no spacing after it. I can’t figure out how to fix that. I don’t think that Home item will ever have a down arrow.

This seems to be a pretty important missing option for menus, so I want to add it as a standard option.

[Weaver]

@scrambler –

Never mind – I figured out I probably needed to add a class  to the default menu – could be a useful class anyway, so there can be a special rule for this.

This new option will be added to Weaver Xtreme 1.0.1.

[Gillian]

When I wanted to adjust the padding on my (centred) menus after converting this site, I just put
{padding-left: 8px; padding-right: 8px;}
in the Item Background CSS+ box.

Having looked at scrambler’s more complicated CSS, was my solution too simplistic?  Or was I only able to get away with it because I don’t display the arrows?

[scrambler]

yes, if you don’t have the arrows, only the first rule is needed

[Weaver]

And there are other issues, too.

It did take some pretty custom code (and not just CSS) to get the wider spacing to work for pages using the default (non-Custom) Menus – the Home item takes special handling.

All in all, it turned out to be quite complicated to handle the different cases – default vs. custom menus, arrows vs. no arrows. The new option for 1.0.1 – not yet released – will make that all just a “checkbox” option.

[DianeClancy]

I am using Weaver Xtreme 1.0.2.6 but I don’t see where to find the “checkbox” for spacing between menu items – I am looking for that too.

Thank you!!  ~ Diane Clancy

ps I have looked and looked  🙂

[scrambler]

Main Options > Menus > xxx Menu Bar > Desktop Menu Spacing: option box

[Weaver]

Main Options : Menus : Desktop Menu Spacing : value in em. About 2/3 way down of each menu area (primary, secondary, etc.). has a <–> icon in the left column.

[DianeClancy]

What am I missing?  I just don’t see this there … Desktop Menu Spacing

Main Options > Menus >  then
> Header Mini-Menu
or

Primary Menu Bar |
Secondary Menu Bar |
Options: All Menus |
Header Mini-Menu |
Info Bar |
Extra Menu (X-Plus)

I am not seeing the Desktop Menu Spacing

I am sorry to be so confused 🙂  Thank you!!  ~ Diane Clancy

[scrambler]

2/3rd down the menu bar options, between

Desktop Menu Vertical Padding: and Add Classes box

Hide Arrows:		Primary Menu Bar: Hide Arrows on Desktop Menu
Desktop Menu Vertical Padding:	em	Primary Menu Bar: Add vertical padding to Desktop menu bar and submenus (Default: 0.6em)
↔Desktop Menu Spacing:	em	Primary Menu Bar: Add space between desktop menubar items (Use value > 1.0)
{ } Add Classes:		Primary Menu Bar: Space separated class names to add to this area (Advanced option) (★Plus)
Left HTML:	Any HTML, including shortcodes.  Add HTML Left (Works best with Centered Menu) (♦)(★Plus)

[DianeClancy]

Oh I see Weaver and Scrambler

I am using Header Mini-Menu for the main menu …. I need to look and see why I thought that was better – I think because it could go above the header but maybe the regular one can too – thank you – I will look

on the primary menu, it is quite clear 🙂  Thank you! ~ Diane Clancy

[DianeClancy]

I can see why I used the Header Mini-Menu – it easily (for me) went above the header (where my friend wants it) – and when I put the primary menu there, it doesn’t have the formatting I want … so I need to dig in again with why I did what 🙂  Thank you for your patience!!  ~ Diane Clancy

[DianeClancy]

OK …. I can see why I used the header mini-menu

I have double headers (thank you again for showing me how 🙂 )

primary menu puts below both headers
secondary menu puts above both headers

mini-menu puts the menu between them as I want … and the mini-menu doesn’t have the desktop menu spacing – any thoughts?

Thank you again!!!  ~ Diane Clancy

[Author]

Posts