skip to content

Framer logoframer · HeyBraza shows you

framer site not responsive on mobile

HeyBraza scans the phone breakpoint, spots the element wider than the viewport, and points right at it.

your framer site looks fine on desktop but breaks on mobile - cut off, zoomed out, or not filling the screen. the cause is almost always one element with a fixed width pushing the layout wider than the phone. here's how to find and fix it.

or do it yourself

  1. 1switch to the phone breakpoint using the breakpoint tabs at the top of the canvas.
  2. 2look for any layer with a fixed pixel width (e.g. 1200px) wider than the phone frame - that one element forces the whole page wide.
  3. 3set wide elements to 'fill' or a relative width instead of a fixed pixel value so they shrink to the phone.
  4. 4check images and sections too - a single oversized image is a common culprit.
  5. 5still off? select the phone breakpoint's top frame and set overflow to 'hidden' to kill leftover horizontal scroll.

let HeyBraza do this with you

HeyBraza is a tiny on-screen guide that points at the right buttons and talks you through it, on windows and mac.

download

common questions

why is my framer site not filling the screen on phone?

an element wider than the mobile viewport (usually a fixed-width layer or image) is forcing the page wide - set it to fill instead of a fixed pixel width.

why is there horizontal scrolling on my framer mobile site?

something extends past the viewport; find the over-wide element and switch it to fill, or set the breakpoint's overflow to hidden.

more fixes