Streaming live at 10am (PST)

Breakpoints for mobile devices


#1

Hi,

I am trying to change styles on the mobile views but it is affecting my desktop view. I hid some things for mobile which is fine but there are other things that need to stay but need to be moved. It is a basic two page site at the moment but I need it to work right on all levels until I can get the new site up. Redesigning everything at the moment is not an option and I tried to remove/change the class/style but it is changing the desktop version as well. What am I missing? I didn't see much about this topic in the responsive design video, which is not in the help center link under design.

Thank you in advance....
Here is the view link:
https://preview.webflow.com/preview/practice-c1882d?preview=f0a287d7e2467a66d6fc407e4dcb23dc


#2

Hey @MarketingSVI,

Normally it's quite simple.
If you display none something on desktop, i ll display none on all the breakpoint under (here tablet, landscape and mobile).

Here i displayed none the H1 on the desktop breakpoint.
Notice that all breakpoint under are affected.

Now if you display none something starting with the lower breakpoint (here mobile). It ll affect only the mobile breakpoint and under. Notice that this time landscape, tablet and desktop are still displayed.

Last thing, let's say you want to remove something on the desktop and on the mobile but let it display on the tablet + landscape.

Display none on desktop (it affects all the breakpoint under as we saw previously).
Display on tablet (again, it affects all the breakpoint under as we saw previously).
And display none the mobile.

Knowing this you should be a breakpoint killer now but let me know if you need something else.


#3

Hi,

Thank you. Yes that is how it is supposed to work. And the hiding feature is working fine. The part that is not working.... is when I change something in phone breakpoint it changes it on the desktop breakpoint, which is what it is not supposed to do. So when I was in the mobile breakpoint and removed a class from a photo so I could add a specific one for the mobile breakpoint, it removed that class from the same photo on the desktop breakpoint. If I understand this correctly it should not be affecting the desktop breakpoint.

Cherril


#4

Hey @MarketingSVI,

Deleting/renaming a class, moving an object, deleting an object affect the whole project.
For your case, you could add a combo class i guess.
Thanks


#5

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.