Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #440131

    Greetings,
    I am working on adding different fullwidth submenu elements to each one of the pages on my site so they act as “sticky” bars (they only have a decorative function so there are no links inside the submenus). So far so good, but I need to change two things:

    1- I need to increase the size of the menu bar, right now its too thin
    2- I need to change the color of the submenu bar for each page. I am using the “alternate Content” set of colors but that leaves me with the same color for all the submenu bars in all pages (green) and I want them to be different for each page. To do this I tried setting a custom Css Class for each submenu but I’m not sure if that will work. Could you please help me with quick css code to obtain this?

    Thank you so much for your help!

    #440717
    This reply has been marked as private.
    #441242

    Hi!

    Try adding this to a codeblock element in each page.

    <style type = "text/css">
    .av-submenu-container, .av-submenu-container * {
      background: none repeat scroll 0 0 red !important;
    }
    .av-submenu-container { height: 75px !important; }
    </style>

    Regards,
    Elliott

    #441397

    Elliott, thank you very much for your reply.
    I tried using your code in different code block elements like you suggested but did not work. However I took pieces of your code and used it in the quick css:
    The submenu heigh was pretty straightforward in quick css, and for the custom submenu color bars first I defined a Custom Css Class for each fullwidth submenu and then changed the color of each custom class using your code in the quick css.

    Thanks again for your prompt response and suggested solution!

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Fullwidth Submenu different colors for each page’ is closed to new replies.