Finding right menu CSS

[AshleyF]

I am struggling to find the right CSS selector for the topbar menu. I have created some CSS to add a vertical line between links but I can’t find the selector.

I am currently using to no avail.

li.e29586-7.x-menu:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 0.5px;
    height: 10px;
    margin-top: -10px;
    background-color: #ffffff;
}

Also, I have a search dropdown selected. Is it possible to have the dropdown actually pop out but inline across the top menubar instead of dropdown?

[ruenel]

Hello Ashley,

Thanks for writing in! You need to use the Google Chrome Developer Toolbar to check the live HTML code and find which CSS selector you need to use.

You will get something like this:

Therefore, your CSS code should be:

.e29586-7.x-menu {
    position: relative;
}

.e29586-7.x-menu:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 10px;
    height: 10px;
    margin-top: 0;
    background-color: red;
    z-index: 1;
}

I used different values like the red color so you can easily spot whether the CSS is applied to the menu.

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third party developer.

Best Regards.