Okay
  Public Ticket #1501646
Hemma - mobile view
Closed

Comments

  • Rachael Bradley started the conversation

    Hi there,

    I am trying to improve the look of my mobile site. My hero image does not stay central on mobile. The bed image is pushed over to the left. Can this be set to always be centralised? Also, on the customised view, the font is lined up with the logo nicely, however, when I look live on my phone, the copy is central but the logo is pushed over to the left because of the navigation. Can the logo position be set to stay central?

    Thank you

    Rachael

  •  240
    Elena replied

    Hi Rachel,

    1) I'd recommend to edit the image in Photoshop to make sure that it is properly centered. Here's what it's like:

    And here is how it should be:

    2) You need to add some custom CSS. For example:

    @media screen and (max-width: 768px) {
        .site-header .site-branding {
            position: absolute;
            display: inline-block;
            left: 50%;
            -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
            transform: translateX(-50%);
        }
    }


    And set the logo width at 210px.

    Cheers, P.


  • Rachael Bradley replied

    Thank you. I seem to have fixed the problem on mobile and it looks a lot better, thank you. However, it seems to have created an issue with the white logo on the homepage which I think may have something to do with the new CSS. Could you advise? Thank you.

  •  240
    Elena replied

    No it doesn't, your image is stretched.