• I use the Morphology theme and the homepage is really cool with ‘image posts format’.

    But my site marhotelriovermelho.com.br does not build a mosaic in the mobile version. In the mobile version, one image is underneath the other.

    All images are of the size 900 x 600 px.

Viewing 12 replies - 1 through 12 (of 12 total)
  • Theme Author Shaped Pixels

    (@shaped-pixels)

    That’s normal behaviour.

    On a mobile screen mosaics would be way to small to tap on and the titles on hover would be unreadable – that’s why they are full size and displayed underneath each other

    Thread Starter balloonmkt

    (@arlesmendes)

    I wish it was as it is in the demo.
    http://demos.shapedpixels.com/?theme=Morphology

    I have used the theme morphology other times and the images have remained in rows of 3 in the mobile version.
    http://hospedagempraiamaresias.com.br/

    Theme Author Shaped Pixels

    (@shaped-pixels)

    I think you have modified some part in in theme and used home template to show three images in one row. But you can solve this problem. For this you can add following css in Additional CSS.

    @media screen and (max-width: 480px) {
    .home .image-post .hentry {
    max-width: 100%;
    }
    }

    Thread Starter balloonmkt

    (@arlesmendes)

    I include the css code, but nothing has changed: /

    Theme Author Shaped Pixels

    (@shaped-pixels)

    Hi,

    You have to put above css in additional css area in customizer.

    @media (max-width: 480px) {
    .home .image-post .hentry {
    max-width: 100%;
    }
    }

    If this still isn’t working send me your site url.

    Thread Starter balloonmkt

    (@arlesmendes)

    Didn’t worked :/
    url: http://marhotelriovermelho.com.br/

    Theme Author Shaped Pixels

    (@shaped-pixels)

    I have checked your site. It is working same like demo. In mobile it is displayed single image in one row and in ipad it displayed two images..

    Thread Starter balloonmkt

    (@arlesmendes)

    How can I set up rows with 3 images to always appear?
    Desktop: 3 pictures, Mobile: 3 pictures and Tablet: 3 pictures

    Theme Author Shaped Pixels

    (@shaped-pixels)

    Hi,

    To get 3 images to always appear in every devices. Please add following code in your additional css in theme customizer.

    
    @media (min-width: 48em)
    style.css?ver=4.7.5:2367
    .image-post .hentry {
        max-width: 33%;
    }
    
    @media (max-width: 480px)
    (index):191
    .home .image-post .hentry {
        max-width: 33%;
    }

    Thanks

    Thread Starter balloonmkt

    (@arlesmendes)

    I included but did not change.
    Can you verify that the inclusion is correct?
    marhotelriovermelho.com.br

    Theme Author Shaped Pixels

    (@shaped-pixels)

    Hi,

    Yes I saw you have included those css. But I forgot to remove two lines which is causing this to not changed. Please include following css.

    `@media (min-width: 48em){
    .image-post .hentry {
    max-width: 33%;
    }
    }

    @media (max-width: 480px){
    .home .image-post .hentry {
    max-width: 33%;
    }
    }

    Thread Starter balloonmkt

    (@arlesmendes)

    Excellent, thank you.

Viewing 12 replies - 1 through 12 (of 12 total)

The topic ‘Morphology in Mobile’ is closed to new replies.