Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • December 22, 2017 at 9:51 pm #891732
    brandesigns

    Hello,
    I need to have my clients menus/header to have an overlay like a transparent rgba darker color so that these areas display on the home page over the Fullwidth Easy Slider regardless of what image displays. Some of the images have a light background and you can’t read the logo/menu areas. Is there a simple CSS I can add to accomplish this.

    Thank you,
    Tracey Devlin

    December 22, 2017 at 10:33 pm #891738
    John Torvik

    Hey brandesigns,

    You can add this custom CSS code:

    #header_main {
  background: rgba(0,0,0,.2) !important;
}

    Best regards,
    John Torvik

    December 26, 2017 at 9:38 pm #892069
    brandesigns

    Thank you for the response. This doesn’t work for the main page header/logo/navigation area. I’ve tried adding in different classes as well. Nothing seems to change the background. Color changes fine upon scroll.

    Thank you. Hopefully I’ll get a solution soon.\

    December 26, 2017 at 10:55 pm #892076
    Basilis

    Hi,

    Try the selector as #top .av_header_transparency #header_main
    and let us know if it works

    Best regards,
    Basilis

    December 27, 2017 at 6:26 pm #892178
    brandesigns

    Sorry,
    That didn’t work either.
    Thanks – can you help me keep trying to solve this issue?

    December 27, 2017 at 10:36 pm #892259
    Victoria

    Hi brandesigns,

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    January 2, 2018 at 9:28 pm #892594
    brandesigns
    This reply has been marked as private.
    January 5, 2018 at 6:23 pm #893780
    Victoria

    Hi brandesigns,

    Actually, not really. John’s solution was okayish, just the logo is a bit too dark for it. I would just use a different selector.

    
#header {
  background: rgba(0,0,0,.2) !important;
}

    You either use different images for the slider, with the same colors, more or less, on top, or put the slider below the header without transparency header.

    Best regards,
    Victoria

    January 5, 2018 at 10:00 pm #893840
    brandesigns

    It’s so strange. When I use my Inspector Element in Chrome or Firefox and change the header to show the rgba darker overlay it works. But when I add the code to the custom CSS, it doesn’t change anything. I am using a child theme. Do I need to copy the main theme CSS & copy to the Child theme to change the overlay the rgba darker overlay so that it displays like we’d to see?

    Thanks for the assistance.
    Tracey
    Brandesigns Web Solutions

    January 6, 2018 at 1:11 pm #894057
    Rikard

    Hi Tracey,

    Sometimes the custom CSS doesn’t apply because of caching, did you try to put it Quick CSS to see if it works better there?

    Best regards,
    Rikard

    January 6, 2018 at 6:44 pm #894170
    brandesigns

    Hello Rikard,
    I guess I didn’t make myself clear. I am putting the code into the the Quick CSS within Admin Template. I am wondering if I need to place a Style.CSS into the child template with the changes to see if that will force the overlay?

    Thank you,
    Tracey

    January 7, 2018 at 8:28 pm #894461
    Victoria

    Hi Tracey,

    You need to place the code only in one place. In quick css or the css file.

    Best regards,
    Victoria

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