Home Forums ArileWP Pro Background color menu at transparent header

Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #28753
    Thomas
    Participant

    How can I assign the background color of the open menu on the smartphone with a transparent header via CSS? I would like the background of the open menu to be black at this point. The header itself must remain transparent.

    #28755
    themearile
    Keymaster

    Hi Thomas

    Thanks for contacting us.

    Please share your site URL so we can take a look and provide you with a good solution.

    Thanks

    #28757
    Thomas
    Participant

    Hi, thank you for your repley.
    Please open http://www.th-fotografie.info in mobile view and click the menu on. You will see the menu items in transparent background. this background should be black. the header only transparent

    #28759
    themearile
    Keymaster

    Hi Thomas

    Yes, please add the below CSS code in the Additional CSS box, Please go to the Appearance => Customize => Additional CSS then paste the CSS here and click to Publish button.

    @media (max-width: 500px) {
    .navbar.navbar-header-wrap {
    background-color: #18191b !important;
    }
    }

    Let us know if it works.

    Thanks

    #39003
    Johan de Groot
    Participant

    Here you go, white background for the transparent menu smaller than 991 pix with black text:
    (adjust accordingly)

    @media (max-width: 991px)
    {.navbar .nav {

    background: #ffffff;
    }}

    .collapse.show {
    display: block;
    background: #ffffff;
    }

    @media (max-width: 991px)
    {
    .navbar.navbar-header-wrap .nav .menu-item .nav-link, .navbar.navbar-header-wrap .nav a.cart-icon, .navbar.navbar-header-wrap .nav .theme-search-block a {
    color: #000;
    }}

    @media (max-width: 991px)
    {.navbar.navbar-header-wrap .nav .dropdown-item {
    color: #000000;
    }}

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