• I would like to have my sticky header be transparent. What specific CSS would I need to accomplish this? Thanks!

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • You can use this css.

    #header-section .is-sticky #header.sticky-header {
        background-color: transparent !important;
    }

    However transparent sticky header will look ugly when you’ll scroll down and reach to the white section.

    Thread Starter Drew75

    (@drew75)

    Thank you @vijayhardaha. I’m sorry, I should have better stated what I’m wanting as I mistyped my request. I didn’t mean to state my need for a fully transparent sticky header but instead a sticky header that would look semi-transparent. Perhaps one I could control the level of transparency through with percentages. Would you be able to assist with this?

    @drew75 You might find a setting in the theme option to change the color or if not then you can use custom css with rgba color codes.

    #header-section .is-sticky #header.sticky-header {
        background-color: rgba(255,255,255,0.65) !important;
    }

    where 0.65 is transparency level and 255,255,255 is white color RGB.

    Thread Starter Drew75

    (@drew75)

    That did the trick. Thank you @vijayhardaha!

    Glad to know.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Transparent sticky header’ is closed to new replies.