Selector for drop-down items in main navbar - Support | Kriesi.at

Tagged: Color, CSS, navbar, selector, size

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts
November 25, 2013 at 1:43 am #192697

Jason E
Participant

I am having a devil of a time setting the font sizes. I have got some of them figured out, but the selectors are not always easy to figure out, or are a mile long.

What is the best way to grab all of the drop-down items from the main navbar and correctly set their attributes like size and stateful color?

http://pwec.spireworks.pro/

November 25, 2013 at 1:49 am #192699
Yigit
Keymaster
Hi solarmediapro!

Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as desired
```
#top .main_menu .menu li ul a { font-size: 18px; } /* font size of sub menu items */
.header_color .main_menu .menu ul li a { color: red; } /* color of sub menu items */
#top .header_color .main_menu .menu ul li>a:hover { color: green; background-color: blue; } /* hover state of sub menu items */
```
Best regards,
Yigit
November 25, 2013 at 9:08 am #192813

Jason E
Participant

Thank you. Any chance of getting a cheat sheet for commonly-used css elements?

November 25, 2013 at 3:13 pm #192936

Yigit
Keymaster

Hi!

You are welcome! We do not have such cheat sheet but if you can point out elements that you would like to customize, we can gladly provide them :)

Cheers!
Yigit

April 7, 2014 at 6:51 am #248049

Jason E
Participant

I got a few things figured out, but still having a heck of a time with the navbar. I really wish there was an easier way to specify font sizing, coloration and style. Case in point, I need a font in black weight (900), but I have not been able to find any way to achieve this in the navbar, even with the above.

http://oc1.spireworks.pro/

I need to specify the navbar font, size, color, style and weight. For some reason, Enfold wants to insert its own color schemes (tint of orange selected in the Enfold style menus. It also refuses to let me specify the weight.

Navbar needs to be Myriad-Pro font-size: 16px, font-weight: 900. I want the navbar (main) to be in normal state color #ffdcbd. In hover and active state: color: #ff7700; background-color: #fff; text-decoration: underline;

Navbar drop-down items need to be similar: normal state: font-weight: 900; font-size: 14px; color: #ff7700; background-color: #fff.
In hover/active states: color: #cc4400; text-decoration: underline;

We really need a better way, and we are willing to pay for a more advanced admin, if offered. That, or a cheat sheet for css elements. Enfold is so deep that it is hard to find what controls what without having selectors a mile long. We want to really push what Enfold can do, because it is an amazingly powerful platform (beyond just a theme). Maybe that is more of a way of asking for a Pro version of this theme, which we again would be very happy to purchase. I don’t care if it is $200. A good platform is the foundation for any website.

April 8, 2014 at 5:56 am #248611
Josue
Inactive Moderator
Hey!

Try adding this code to the Quick CSS:
```
#avia-menu > li > a {
    font-weight: 900 !important;
    font-family: 'Myriad Pro';
    font-size: 16px !important;
    color: #ffdcbd !important;
}
#avia-menu > li > a:hover{
    color: #ff7700 !important;
    background: white;
    text-decoration: underline;
}

#avia-menu .sub-menu a{
    font-family: 'Myriad Pro';
    font-weight: 900; 
    font-size: 14px; 
    color: #ff7700; 
    background-color: #fff;
}

#avia-menu .sub-menu a:hover{
    color: #cc4400;
    text-decoration: underline;
}
```
That platform for editing the style of certain parts of the theme is already on plans.

Cheers!
Josue
Author

Posts