[Support request] Menu on mobile

Home Forums Support [Support request] Menu on mobile

Home Forums Support Menu on mobile

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1562250
    Yvan

    Hello,

    I have a problem with my mobile menu. This one is displayed over my title in transparency… no problem on the homepage.

    An idea to solve the problem ?

    https://postimg.cc/XG37v3Tz

    And on the homepage, how to have a bigger image centered with a text defined on a mobile ?

    https://postimg.cc/0zcCn2Cp

    Thanks !

    #1562381
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can link us to the site in question?

    You can use the private information field.

    Let me know ๐Ÿ™‚

    #1563528
    Yvan

    Hi Leo,

    i’m sorry, the link to my site is ok now.

    #1564234
    Leo
    Staff
    Customer Support

    Glad to hear ๐Ÿ™‚

    #1564398
    Yvan

    I told you that I have updated my profile and that my site is identified in it.

    Can you please help me?

    #1564942
    Elvin
    Staff
    Customer Support

    Hi,

    Are you still trying to solve the same issues?

    For the mobile header, the logo’s image size is too big for some mobile devices, causing the navigation toggle to wrap under the logo.

    To address this, consider reducing the width of the logo so both the logo and the menu toggle fit within 1 row.

    You can adjust the mobile width of the logo by adding this CSS:

    /* Logo width on mobile */
    @media(max-width:768px){
    .site-header .header-image {
        width: 250px;
    }
    }

    And on the homepage, how to have a bigger image centered with a text defined on a mobile ?

    To clarify: Are you trying to vertical center the page hero’s article title only?

    A wise man once said:
    "Have you cleared your cache?"

    #1566320
    Yvan

    Hello,

    thank you for your answer.
    I would like the image like this but with a small text
    https://postimg.cc/TKP9KZgt

    For the menu is better, but it hides my title
    https://postimg.cc/RNpPLSMk

    Thanks

    #1566653
    Elvin
    Staff
    Customer Support

    I would like the image like this but with a small text
    https://postimg.cc/TKP9KZgt

    You seem to have resolved the text sizing w/ @media rule.

    As for the page-hero sizing, you can do that by either adding more top and bottom padding to the mobile view on the Header Element’s settings or adding another @media rule that sets your min-height.

    Example:

    
    @media(max-width:768px){
    .inside-page-hero {
        min-height: 400px;
        display: flex;
        align-items: center;
    }
    }

    display: flex; and align-items: center; are optional as they’re just added to vertically align the title.

    For the menu is better, but it hides my title
    https://postimg.cc/RNpPLSMk

    You can try removing the nav bar’s margin top so it doesn’t go too far down

    @media(max-width:768px){
    .has-inline-mobile-toggle #site-navigation.toggled {
        margin-top: 0; 
    }
    }

    You can also consider resizing the menu items on mobile so appear to large to the point where they overlap with the title.

    A wise man once said:
    "Have you cleared your cache?"

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