Reply To: Customizing the CSS dropdown submenu

[Robert Kavgić]

Hello,

You want to achieve something like displayed in the screenshot I’ve attached to this post?

If you do, the only thing to modify is the top: rule, as you did.

Go to style.css to about line 846 where it says:

.dropdown-submenu > .dropdown-menu {
  top: -2px;
  left: 100%;
  -webkit-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.1);
}

Modify the top rule and set it to e.g. 16px, like the following:

.dropdown-submenu > .dropdown-menu {
  top: 16px;
  left: 100%;
  -webkit-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.1);
}

You sub-menu should be the same as you can see it in the screenshot.

Robert