Hi there,
I recently got tasked to design a website, but upon discovering Webflow I thought I’d give building it a go too but I’m really struggling with making it responsive across all platforms.
Everything looks fine in preview mode but as soon as I view it on an actual ipad or mobile, everything misaligns!
Any advice would be greatly appreciated, thanks!
Hi,
Most likely you will need to use custom media queries to make sure responsiveness on all devices - have a look at this article - you will need to add it to the head code of your website
Hi,
Thank you for your help but unfortunately webflow appears to be controlling it too much for me to use what is provided in this article
Hi @lf250855, could you let me know which page is giving the most trouble so I can take a look as an example?
Thanks in advance
Hi @cyberdave,
This page is giving me the most bother: https://preview.webflow.com/preview/stuarts-fantastic-project-8252a9?utm_medium=preview_link&utm_source=designer&utm_content=stuarts-fantastic-project-8252a9&preview=c16b94d412f16f82564fa7ddb5f770f5&pageId=5dea49ea49103cccfb9b66f8&mode=preview
Realistically, I would like to have the photos scale down to device size but the only way I’ve found this possible so far, is by removing the images for phone. Even then, the text misaligns depending on the device used to view!
Thanks in advance
Hi there.
Thank you for sharing the preview link. Having the photos scale down within the relatively layout you have designed can be achieved in a smooth way utilizing flexbox (if you haven’t checked that out yet).
I made a quick video showcasing how we can approach an experience like this using Flexbox that hopefully can bring some inspiration in tackling the right solution.
Please let us know if you have any further questions or issues; we’re here to assist.
Riley
Thank you so much!
As a newbie to all of this the different layouts became a bit confusing - thanks for clearing it up!