Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 15, 2022 at 4:16 pm #1340738
    Veronika

    Hi dear Kriesi-Team,

    I managed to set my Header to be transparent on my web version: https://imgur.com/05TU6Hn

    unfortunately I have no clue how to set it on my iPad version: https://imgur.com/8Sx0C7Z

    and on my Mobile version too: https://imgur.com/dDs3A1V

    It always appears as a complete white Header. How can I change that?

    Thank you very much and have a lovely day

    Best,
    Veronika

    February 15, 2022 at 8:37 pm #1340786
    Yigit

    Hey Veronika,

    Thanks for contacting us!

    Please refer to this post – https://kriesi.at/documentation/enfold/header/#transparent-header-on-mobile :)

    Regards,
    Yigit

    February 20, 2022 at 8:05 pm #1341528
    Veronika

    Hi Yigit,

    everything worked perfectly thank you. Do you have any idea how I can get rid of these white columns? https://imgur.com/PqeZ1sf

    Thank you very much

    Best,
    Veronika

    February 21, 2022 at 8:10 am #1341581
    Ismael

    Hi,

    Thank you for the screenshot.

    You can use this css code to remove the default padding of the cells on mobile view.

    @media only screen and (max-width: 767px) {
    .responsive #top #wrap_all .av-flex-cells .no_margin {
        padding-left: 0;
        padding-right: 0;
    }
}

    We provided a screenshot of the result in the private field.

    Best regards,
    Ismael

    February 21, 2022 at 2:04 pm #1341648
    Veronika

    Hi Ismael,

    I added the code and cleared the cache, unfortunately it is not working. Any other ideas?

    Thank you

    best,
    Veronika

    February 21, 2022 at 2:23 pm #1341655
    Yigit

    Hi Vera,

    I edited your CSS code in Appearance > Custom CSS and changed it to following 

    @media only screen and (max-width: 767px) {
.responsive #top.home #wrap_all #av-layout-grid-1.av-flex-cells .no_margin {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

    Please review your website :)

    Best regards,
    Yigit

    February 21, 2022 at 5:23 pm #1341684
    Veronika

    Hi Yigit,

    It was only meant to be for the first post, all others posts should not be displayed full width.

    the first should be like this: https://imgur.com/Ov713s9
    and all the rest like this: https://imgur.com/UHlO0ee

    I that possible to achieve?

    Thank you
    Best,
    Veronika

    February 21, 2022 at 5:56 pm #1341691
    Yigit

    Hey,

    I updated your code and used more specific selector so it only applies on the first post 

    @media only screen and (max-width: 767px) {
.responsive #top #wrap_all .av-flex-cells .left-section .no_margin {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

    Please review your website :)

    Cheers!
    Yigit

    February 21, 2022 at 5:59 pm #1341697
    Veronika

    Yigit,
    seriously, you are the best!

    Thank you very very much :)

    You can close this now

    February 21, 2022 at 6:06 pm #1341704
    Yigit

    Hey,

    Glad I could help! Let us know if you have any other questions and enjoy the rest of your day!

    Regards,
    Yigit

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘transparent header’ is closed to new replies.