[Resolved] Ipad Issues

[Andy]

Hi Tom,

My colleague has noticed a few display issues on the home page of a site I’m building in Ipad Portrait and Landscape. Unfortunately I dont have an Ipad to check these but on my Android tablet there are no issues so I tend to think the problem is with his Ipad Browser.

However, I would really appreciate having a look at this to confirm any Ipad issues.

Screenshots:
http://prnt.sc/dd836b – Logo not positioned correctly
http://prnt.sc/dd844j – Slider and first 2 buttons out of alignment

URL:
http://tinyurl.com/jzn4n3y

[Tom]

The header thing is odd, seems to only happen on orientation change.

Try adding this CSS just to test:

.site-logo {
    float: left;
}

As for the columns, you need to add lgc-tablet-push and pull classes as well.

[Andy]

I’ve added the float to a min-width: 1024 media query as it was stopping the header widget from wrapping under the logo in portrait tablet and below views.
Can you see if it helps landscape view? – Although this is isnt a big issue as my colleague has confirmed it only happens on orientation change and is fine after refreshing.

The columns already had tablet push/pull classes and it seems it was these causing the tablet portrait issues, adding the following CSS seems to have fixed it:

.lgc-tablet-push-25, .lgc-tablet-pull-50 { left: 0 !important; }

Can you pls check portrait view?

[Tom]

iPad is currently being used for nursery rhymes, but will check as soon as I get it back.

I’ll look more into this orientation change thing – might be a bug (a very strange one).

[Tom]

Strange, I can’t get this to happen at all on my test sites.

Adding the float left on your site seems to have fixed it on my iPad.

[Author]

Posts