This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

SubMenus width on Vantage Premium

Resolved 8 replies premiumthemetheme-vantage
ccie10391
11 years ago · Last reply by Bjarne 10 years ago

Hi Folks,

Have a question kinda related to this thread:

SubMenus on Vantage Premium.

I’m using premium version of Vantage theme and want to tweak a bit the way submenus look. AFAIK by default way submenues are displayed using common width of 200px. The submenus I am using are quite long for this width and I tried the workaround suggested in the link above. However that workaround has two side effects:
1. When you hover pointer over this menu item it highlights only part of the menu item, which has characters. The rest of the menu item remains unhighlighted. Basically each submenu item has its own highlighted width.
2. Some of submenu items (which are kinda short) are arranged in one line as two of them fit the current submenu width.

Currently I am using tweaked value of width in this style.css item:
.main-navigation ul ul a {
width: 200px;
padding: 15px 20px;
}
Obviously it changes the way how all the submenus look like. Is there a way to use dynamic width for the submenus, like width:100% suggested in the thread referred above, but without side effects I described?

BTW, thanks much for this really nice theme!

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

8
  1. Andrew Misplon Staff 11 years, 4 months ago

    Hi ccie10391

    Give this a try under Appearance > Custom CSS:

    /* Vantage Sub Menu Width */
.main-navigation ul ul a {
min-width: 250px;
width: auto;
white-space: nowrap;
}

    Set the min-width to where you want it. Things should hopefully be dynamic past that min-width.

  2. ccie10391 11 years, 4 months ago

    Wow, thanks for a very quick response, Andrew!
    This tweak kinda works for #2, but #1 is stil the same. It looks better now, with min-width. However with submenues, in which some items are longer than min-width, the rest of submenu items have shorter highlight area.

  3. Andrew Misplon Staff 11 years, 4 months ago

    For sure. Please can you send through a link and I’ll take a look at this live on your site.

  4. ccie10391 11 years, 4 months ago

    Sure, here it is:
    http://dialog-leader.com/
    a good example will be submenu under “services” in the main menu.
    Thanks a lot!

  5. Andrew Misplon Staff 11 years, 4 months ago

    Give this a try:

    /* Vantage Sub Menu Width */
.main-navigation ul ul a {
  width: auto !important;
}
.main-navigation ul ul li {
min-width: 250px;
white-space: nowrap;
width: 100%;
}

    Works for me.

  6. ccie10391 11 years, 4 months ago

    Works like a charm! Thanks for your support, Andrew!

  7. Andrew Misplon Staff 11 years, 4 months ago

    Super, glad we could help.

  8. Bjarne 10 years, 17 days ago

    Still works! Thnkx! :)

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread