Streaming live at 10am (PST)

Need help with slider location on tablet and mobile devices

Hey guys! Okay I keep running into an issue with a slider on the nav bar. There are two slides each with an image of a contractor. The slider is located in the sidebar above the "“Schedule a free estimate”.

The problem: When you go to tablet or mobile devices, it looks great in preview. However when viewed on an ipad or iphone 6 it does not have the correct “-” display margin.

To view go to the dynamic “Service Template”
Preview link:

HTML link of the page:

Thank you for taking the time to help!

Here is my public share link: LINK
(how to access public share link)

Hi I don’t see a slider in navbar either in webflow projetc or published page, can you help me find it?

Also I suspect your phone is different from the default widths views of webflow. Do you know you can do what I do in the screencast here?

You have to do that for each breakpoint in order to be sure you address all sizes of devices.

Thanks vincent for your reply!

Sorry instead of navbar I meant to say “Sidebar” on the left hand side, top portion within a global element. Each slide is an image of a different contractor

Thanks for the screencast. Yes I did know you could do that I always get stuck on the following:
If I develop for lets say 768px and then I go to 800px… If i change the class it will save for all of tablets and not just 800px. Do I get around that by using percentages for everything?

Thanks for your help!

What I showed, when you slide the width, is still within the same breakpoint! So you need to find values that goes for any width within the breakpoint. You can use % and VH and VW.

Okay sweet thanks!

Any idea on the slider for the sidebar or does that go with your previous comment as well?

I’m not equipped to test on mobile where I am now, actually. But for this effect I would make a animated gif insteead of using a slider, really, actually :slight_smile:

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