Okay
  Public Ticket #3562665
Order of custom split block on mobile phone
Closed

Comments

  • Rhianne started the conversation

    Hello there! Thank you for your great theme and the support offered :)

    I was wondering whether there is any way to change the order that the custom split block appears on a mobile phone? On a laptop, the page looks great - with the hero image at the top and then a split block of text on one side and an image on the other. 

    However, on my phone, this shows up as two images in a row with no border in between, so it looks a bit strange. 

    Thank you for any advice. 

    Rhianne

  •  240
    Elena replied

    Hi Rihanne,

    This request has already been answered: https://opendept.ticksy.com//ticket/1918232/

    Let me know in case you still need help.

    Best, Elena

  • Rhianne replied

    Thank you very much! I searched for 'block' but couldn't see my query. 

    Should this solution work for Custom Post Block as well as the Instagram feed?

    Many thanks!

  •  240
    Elena replied

    Hey,

    Glad that helped! It should work for all split-based blocks!

    Best, Elena

  • Rhianne replied

    Thank you! 

    Sorry - where do I put the code? In the CSS?


  •  240
  • Rhianne replied

    Hi! 

    Sorry to be a pain...

    It has worked perfectly for the Instagram feed but not for the custom split blocks :(

    Thanks,

    Rhianne

  •  240
    Elena replied

    Try adding this code too, it should work:

    @media screen and (max-width: 768px) {
        .block-split-composer .block-content {
            display: flex;
            flex-direction: column;
        }

        .block-split-composer .block-content > .container {
            -webkit-box-ordinal-group: 0;
            -webkit-order: -1;
            -ms-flex-order: -1;
            order: -1;
        }
    }