Homepage panes layout distorted on iPad

  • Anonymous


    Hi there, just wanted to mention that this issue is still happening – https://forum.graphene-theme.com/topic/homepage-panes-layout-on-ipad/.

    I’ve used 3-4 different devices (at home and in the mac store) to test it out and the problem is still there.

    I understand that if you use Chrome/Firefox’s developer tool to check it out, you will not be able to see the problem i.e. everything looks alright in developer tools but if you use an actual iPad, you will notice that the homepage panes do not line up correctly.

    I’ve tried changing the Columns Layout > Container Style from Boxed to Full Width and Full Width Stretched but this did not help.

    This only happens if you use Homepage Panes. Right now you can’t see the problem in the current Graphene demo because it doesn’t seem to be using Homepage Panes (but as you can see from the screenshot in the post I linked above, the problem is visible in the previous version of the demo).

    Would appreciate if a solution for this could be had.



    I was trying to see what could be done and when changing this code (from 50% to 49%), it appears to work:

    @media (min-width: 768px) {
    .col-sm-6 {
        width: 49%;

    After implementing the above code, the homepage panes appear properly aligned on the iPad. Why does this happen? Also, is this a safe fix? Thanks in advance.


    Syahir Hakim


    The code that you changed is not a safe change as it affects the underlying grid system for all elements using the col-sm-6 grid, not just the homepage panes.

    Can you try adding this code to Custom CSS and see if it resolves the issue:

    .homepage_panes {
    	display: -webkit-flex;
    	-webkit-flex-direction: row;
    	-webkit-flex-wrap: wrap;



    Hi Syahir,

    Thanks for getting back. Unfortunately the code did not work.

    Am currently using just 2 homepage panes – but both do not appear side by side. Instead, one is on top, and the other is at the bottom (for both portrait and landscape mode).



    Update: Noticed another user who uses homepage panes post their site over here. I checked it out on iPad and still the problem exists. I can send screenshots if needed. site is yogacorefit.com

Viewing 5 posts - 1 through 5 (of 5 total)

  • You must be logged in to reply to this topic.