Mobile Display Fix & Speed Boost
Budget: $30 – $250 CAD
My site, https://www.torontomidtownsuites.com, looks fine on desktop, yet three key elements break down on phones and tablets:
• the Qi Intro Swipe banner at the very top of the homepage,
• the flip-boxes on the homepage lower section, and
• every flip-box on individual apartment pages.
On mobile these sections render, but their layout is off-center or overlaps other content (the Qi Intro Swipe banner should match the look and feel of https://qi144.qodeinteractive.com).
What I need from you
1. Pin-point the exact cause of the above display issues and apply clean, production-ready fixes—preferably in a child theme or custom CSS snippet—so the pages scale perfectly on iOS and Android browsers.
2. Audit my current stylesheets, strip out unused or redundant code, and consolidate rules where possible to keep them lean.
3. Optimise critical-render CSS, defer whatever can wait, and implement any quick wins (minification, proper media queries, smart loading of Google Fonts, etc.) that push my mobile PageSpeed and Core Web Vitals into the green.
Deliverables
• Correct, responsive rendering of the three problem areas across common breakpoints (tested on Chrome DevTools and actual devices).
• A revised CSS file (or set of files) with comments showing what was removed, merged or added.
• A short before-vs-after report highlighting the mobile PageSpeed score improvement and any follow-up recommendations.
Feel free to propose the tools you prefer—Element Inspector, Lighthouse, PurgeCSS, Autoptimize, WP Rocket, or others—as long as the final outcome is a visibly smoother, faster mobile experience.
• the Qi Intro Swipe banner at the very top of the homepage,
• the flip-boxes on the homepage lower section, and
• every flip-box on individual apartment pages.
On mobile these sections render, but their layout is off-center or overlaps other content (the Qi Intro Swipe banner should match the look and feel of https://qi144.qodeinteractive.com).
What I need from you
1. Pin-point the exact cause of the above display issues and apply clean, production-ready fixes—preferably in a child theme or custom CSS snippet—so the pages scale perfectly on iOS and Android browsers.
2. Audit my current stylesheets, strip out unused or redundant code, and consolidate rules where possible to keep them lean.
3. Optimise critical-render CSS, defer whatever can wait, and implement any quick wins (minification, proper media queries, smart loading of Google Fonts, etc.) that push my mobile PageSpeed and Core Web Vitals into the green.
Deliverables
• Correct, responsive rendering of the three problem areas across common breakpoints (tested on Chrome DevTools and actual devices).
• A revised CSS file (or set of files) with comments showing what was removed, merged or added.
• A short before-vs-after report highlighting the mobile PageSpeed score improvement and any follow-up recommendations.
Feel free to propose the tools you prefer—Element Inspector, Lighthouse, PurgeCSS, Autoptimize, WP Rocket, or others—as long as the final outcome is a visibly smoother, faster mobile experience.