I have finalized the desktop version of the website I am working on:
https://preview.webflow.com/preview/joulestudio?preview=62297ad0886176c0beaef1153b364811
However, my “what we do” and “how we do it” pages are all funky when I check them out on an iPad 2.
Does anybody can advise me on what coud be done to make this work…
Many thanks
GT
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Hi @Gato
Can you define ‘funky’ for us in more detail 
- maybe some screenshots - but also the published link will be useful so we can see for ourselves.
As you move down the breakpoints it’s generally best to go for a % or VH/VW approach to sizing - as set numbers of pixels will cause problems…
Hi @StuM
Thank you for your message and for offering your help.
here is the link to the project again:
First issue:
Here is an ipad screen grap where you can see the text is stuck to the top of the image:
However in the designer tool, it is showing all fine (centered in the middle of the page)
Second issue. On the “What we do” (advertising + Cinema/tv) and the "how we do it page), I have some really nice animations. All beautiful on the desktop version but they don’t look right on ipad.
Here are more screen shots (red circle is where the part of the info appear. Red line is where it should appear):
You can view how it should work here:
http://joulestudio.webflow.io/what-we-do-cinema-tv
Thank for your help again. Let me know if you need more info.
GT
Hi @Gato
On the first issue - can you try centering using Flexbox for Container 36 - publishing - and seeing if that solves it…
Hi @StuM
No…
Any suggestion for 2nd issue?
Or could you advise on who I could reach out for help?
Many thanks.
Gato
Hi @Gato
If you can give it a couple more days there may be more free advice from other users here…sorry i’m a little short on time right now to delve deeper!
We can also move the post to the ‘Freelance’ category where you can ask for paid help…let me know.
Or you can contact a verified expert at https://experts.webflow.com/ or try the independant Head.ai | David Head (i’ve not used either - just signposting)
Hope that gives you some options
Hi @Gato, you mentioned: "You can view how it should work here:
http://joulestudio.webflow.io/what-we-do-cinema-tv"
What is the urls for the pages that are not rendering as you expect on ipad? Here is what I see for the /what-we-do page in the designer:
And then on the published site:
Also, what version of iOS on the iPad are you running?
On Issue #2, here is what I see in designer:
and what I see in the published site:
Thanks in advance
Hi @cyberdave
I have now fixed most of my big issues. The only one I don’t get is:
#ISSUE 1
Page “who we are”: text box on the last image does not center on ipad the way it does on desktop version.
Screen grab from designer tool (or how I would like it to look):
Ipad screen grab (how it is looking once checked from an ipad):
The ipad I am using is an IPAD2 (IOS 9.3.5).
Thank you again for all your help with this.
Have a good Sunday.
Gato
https://preview.webflow.com/preview/joulestudio?preview=62297ad0886176c0beaef1153b3648113
@nita sorry to ask for your help again. but is there any chance you could help me with this last part of this post. Just above.
The issue is with on the iPad. I can’t feature out the setting for the text box…
Thank you again
Hi @Gato,
I’m not able to reproduce this on my end but there is a known bug about how Safari and IOs devices render Flexbox.
You can either do one of the following options:
(1) Redo this Flex element on Safari and the styles should cascade down to smaller IOs devices and fix this issue
(2) Instead of Flexbox, use a combo of absolute positioning and transforms:
Remove all the Flexbox settings onCollection List Wrapper 7and nested elements
Set the display settings to position:relative on Div Block 80:
Set the Collection List 5 to position:absolute and add a 50% margin from the top:
Still on Collection List 5 add a Move Up 50% transform effect:
Hope this helps 
