Align Center images ONLY on mobile

  • Author
    Posts
  • #109349

    polyanarech
    Member

    Hi!

    I’m having a problem with the images in mobile, it appears that the Jason theme has the same problem (not only on my CSS).

    If the images are align left with text by the side, it looks great on PC. But when i use the mobile it looks terrible. It only shows one letter per line by the side of the image.

    The post i need help its my first and only on the blog.

    Is it there a way to fix there? For example, align center images only on mobile, so it’s happen this anymore.. (i used chrome on Samsung S7).

    You can see the screenshots i took so you can understand what happens.

    On pc
    http://www.fatiaimagem.com.br/img/12C46F3E/index.html

    on mobile
    http://www.fatiaimagem.com.br/img/2E2473E0/index.html
    http://www.fatiaimagem.com.br/img/562CBC8/index.html

    Hope you can help me!!!

    The blog I need help with is souldomundo.com.

    #109476

    Hey,

    Thank you for spotting this.

    I’ve had a second look at this and it looks like we need to adjust this in a future release. Until then I recommend using the following CSS code as a temporary fix:

    @media screen and (max-width: 900px){
    img.alignleft {
        float: none;
        margin: 0 auto !important;
     }
    }

    Please, let me know how it went.

    Best wishes,
    Robert

    #109503

    polyanarech
    Member

    Hi!

    Thanks for your answer.

    I add the css code that you sent above.

    But apparently it fixed the problem only on the firts picture (of the eiffel tower), but not in the last (in the sunset). If you can have a look.. it is the first post!

    Thanks.

    #109532

    Hey,

    This one should cover it:

    @media screen and (max-width: 900px){
    figure.alignleft img.alignleft {
        float: none;
        margin: 0 auto !important;
     }
    }

    Thanks,
    Robert

    #109660

    polyanarech
    Member

    It worked!

    Thanks!

The topic ‘Align Center images ONLY on mobile’ is closed to new replies.