Support » Fixing WordPress » Header Transparency in Twenty Sixteen

  • Hi,

    I have been trying to make the header section pf twenty sixteen transparent. I have tried many different things and all I get is a grey block. I can make the whole site transparent quite easily but not just the header.

    It seems the grey block/transparency is sitting on top of the white controlled by the .site.

    I’ve tried all below with different mixtures of selectors but still noththing :

    header#masthead .site-header .site-header-main {
    background-color: rgba(225,225,225,0.2) !important;
    }

    header#masthead .site-header .site-header-main {
    background: transparent;
    }

    Any help will be gratefully received,

    Many thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • Well .site has a background colour of white being applied. I’m not seeing any background colours at all on just the header area.

    Yes, thank you for replying. and it’s that white I’m trying to eliminate but just in the header area for now.

    If I do:

    .site{
    background: transparent;
    }

    the whole site becomes transparent.

    You can’t make the header transparent to remove the background from a container. That’s not how CSS transparency works.

    Transparent means that area has no background, which allows parent colouring to show through (in this case, the white from the .site container).

    So it’s working exactly as expected.

    If you don’t want the header to be white, then you need to give it a different colour — not make it transparent.

    Sorry I obviously haven’t made my self clear. I don’t want the header to be white I want it to be a colored opaque semi transparent. I wanted to make the header area transparent so the background image would show through the opaque site-branding/title area. I can’t do that while the .site is set to white. I do want some of the content area transparent but for now I’m just working on the header.

    Many thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Header Transparency in Twenty Sixteen’ is closed to new replies.