Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #433207

    Hello,
    I have been trying to change the color of one element of the main menu.
    I changed it on the ‘Quick css’, by adding:
    #menu-item-144 span{
    background-color:red;!important;
    }
    But It does not work, it seems like the propriety is not taking into account because overide by the other main rule.
    How should I proceed?
    Thx.

    #433422

    Hey cisqo!

    Thank you for coming back.

    Can you give us a link to this page please? Then we can check and give you the correct CSS.

    You can post it here as a private reply.

    Best regards,
    Günter

    #433468
    This reply has been marked as private.
    #433472
    This reply has been marked as private.
    #433907

    Hey!

    Use this:

    li#menu-item-149 a .avia-menu-text {
      background: red;
    }

    Please refer to this link on how to grab the correct menu selectors: http://kb.oboxthemes.com/articles/how-to-get-css-styles-for-elements/

    Cheers!
    Ismael

    #434073

    Thank you, it works.
    How would you do the same for the list icon down on my website (see ‘EN CAS DE VENTE’), if I am not mistaken they do not have specific ID.
    How could I modify the css of each one independently?
    Regards.

    #434076

    Hi!

    You can turn on custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and apply class for each element.

    Cheers!
    Yigit

    #434107

    Really cool and helpful, is there other hidden fonctionality that I don’t know of? ;)
    but in that case, this sets a class attribute to the whole list, no possibility for me to set different color to each element of the list.
    is it?

    #434113

    Hey!

    You can find all features here – http://kriesi.at/documentation/enfold/ :)
    Can you please post a screenshot and show the changes you would like to make?

    Regards,
    Yigit

    #434130

    Thx for the quick reply :),
    like this

    Also, It seems that I have a problem with my menu, when I reduce the size of my windows, at one point it does not display correctly, it should change to list menu earlier. What do you think? should I open a new topic for that?
    Regards.

    #434563

    Hey!

    Go to Enfold > Mobile Menu panel then set the Header Mobile Menu activation to the second option. Or add this in the Quick CSS field:

    @media only screen and (max-width: 1100px) {
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide {
    display: block;
    }
    
    .responsive .av_mobile_menu_tablet .main_menu {
    display: none;
    }
    
    .html_mobile_menu_tablet #mobile-advanced {
    display: block;
    }}

    Cheers!
    Ismael

    #434701

    Thank you ismael for your response.
    Can’t I instead make one of the menu element disapear instead, so that the mobile menu butons appears onlys when the screen is quite narrow?

    Also, could you please also respon to my main problem of the thread?
    How to set different color to each element of the list (see the picture of my last comment to see what I am trying to do)…

    • This reply was modified 9 years, 1 month ago by cisqo.
    #435308

    Hey!

    Please do not forget to give your iconlist a custom CSS class – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and then add following code to Quick CSS

    .your-custom-css .avia-icon-list li:nth-child(2) .iconlist_icon {
      background-color: red !important;
    }
    .your-custom-css .avia-icon-list li:nth-child(3) .iconlist_icon {
      background-color: yellow !important;
    }

    Regards,
    Yigit

    #435402

    I didn’t know we could do that: nth-child.
    This is great.
    Thank you so much.
    Regards.

    #435417

    Hi!

    For more information, please see – https://css-tricks.com/how-nth-child-works/

    Best regards,
    Yigit

Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.