I created my ENTIRE website and then I noticed the device breakpoints… yea… now it’s basically ruined. It looks fine on all the breakpoints except for the smallest one (the mobile phone one) … on that one it looks like total and complete crap.
I have tried to change it but it is just too irritating because it keeps changing on the desktop one too… it’s making me want to ram my head through a wall. SO i figured if it’s possible it would be easier to just get rid of the mobile version all together. Preferably the desktop version would just be used for all devices if that’s possible. If not just getting rid of the one version is fine. It would eve work to have the tablet version as the mobile phone version.
I am begging somebody to help me… if the fix requires coding that’s fine… literally whatever needs to be done to fix this I will do it. It looks sooooooo bad it’s not even funny. I am soooo upset. I have been working on this crap for weeks.
Webflow is a tool. It is totally possible to manipulate elements with classes when in different break points. Stacking elements on mobile is the easiest way to make a design mobile friendly. You can do that by changing elements from flex / grid to block as needed. You can also hide elements that don’t benefit mobile users.
Since you have not shared a read-only link no one can take a look and offer assistance. I would start there. If you want to learn the tool head to the University. Plenty of how to content and instruction.
Unfortunately unless you revert to an old backup on the project you’re going to need to clear the styles manually from the mobile portrait breakpoint itself. There’s no way to remove any of the breakpoints, all you can do is clear the newly created styles so that the mobile portrait (or above) styles cascade down without being overwritten.
Any blue colored label indicates that a style has been created on that class and breakpoint—with amber colored labels indicating that a style has been inherited from somewhere else—but you can quickly clear any style by ALT/Option+Clicking it’s blue label. If you’re curious what will be used after clearing it, just left-click on the label and you’ll see what class it will pull it’s value from:
I’d argue that you’ll still want your mobile breakpoint to look appropriate for the device size as a huge portion of folks browse the web on these devices. Since the method above to clear all of your styles (one-by-one) will take a fair bit of time, I’d argue that the time could go towards making style changes so it works better on the smaller screen size.
If you include your read-only link I’d be happy to take a peek and give some advice on what could be adjusted.
@Randyyy0007 - Your breakpoints are defined in you CSS which you can access locally if you exported a site. You can’t edit your Webflow hosted CSS unless you use the designer to make changes.
