ABOUT HEARING
This is some heading text that gets smaller in mobile devices.
Description: This heading is really big on the desktop, but we want it to be smaller on mobile devices. Click in the devices in the top bar to see that the text size and line height was decreased.
Responsive Button example
Button TextDescription: This button is meant to be small on Desktop screens because it’s easy to click with the mouse cursor. We made it bigger on mobile devices so that it’s easier to tap with the finger
Button Text
Fix It yourself
TIP: Go to the Tablet device and increase the padding of the button. When you do that it will override the previous styles set on Desktop and will cascade down to all the devices below Tablet.
Responsive Columns example
Column 1
This is some text inside of a div block.
Column 2
This is some text inside of a div block.
Column 3
This is some text inside of a div block.
Description: The Columns Element in Webflow can be customized for each device. By default columns stack next to each other on Desktop and stack on top of each other on mobile devices.
Column 1
This is some text inside of a div block.
Column 2
This is some text inside of a div block.
Column 3
This is some text inside of a div block.
Fix It yourself
TIP: Select a Column or Row element above (you can also use the Breadcrumb bar at the bottom or the Navigator panel on the right to find it), go to the element settings (Gear icon in the top right corner) and make sure the columns stack on mobile devices.