Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #117290
    Lorenzo Belli
    Participant

    Hello Mahesh,
    I am trying to make my website suitable for small screens sherize.com . currently my main problem is that the header cover great part of the screen. Is it possible to make it slide (like in http://gmgc.com.au/) or hide?
    I am using CleanBusinessPro 2.2.2
    Thanks!

    #117301
    Mahesh
    Keymaster

    @krywen: In which page is the issue occurring? I checked your site and seems all is working well, the header image is below the Header.

    Regards,
    Mahesh

    #117316
    Lorenzo Belli
    Participant

    Sorry I couldn’t express myself clearly. In the homepage sherize.com , when opening with a mobile, the top of the page containing site identity (logo, title, subtitle and menu) is sticking to the top of the screen even when scrolling down. The website http://gmgc.com.au/ instead has the menu which is not sticked to the top of the screen but stay at the top of the page, so it get hidden when scrolling down.

    #117329
    Lorenzo Belli
    Participant

    Soved with

    /* Do not use sticky menu on small screen*/
    @media screen and (max-width: 820px) {
        #masthead {
            background-color: rgb(0, 103, 172);
            position: unset;
        }
    }
    /* Remove top padding in case of non sticky menu - I am not toatlly sure about this*/
    @media screen and (max-width: 1024px) {
        body.header-bg {
            padding-top: 0;
        }
    }
    #117365
    Mahesh
    Keymaster

    @krywen: Glad to know you’ve resolved the issue by yourself. Have a nice day!

    Regards,
    Mahesh

Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Hi header on small screens’ is closed to new replies.