Is there a Webflow bug causing the project sliders on my homepage to only slide images halfway, resulting in two half images side by side?
TL;DR
- Ensure the slider and its slides have width set to 100% and no conflicting margin, padding, or overflow restrictions.
- Check for layout conflicts from Flexbox/Grid containers or CMS structures, and review custom CSS/JS that might override slider behavior.
If your slider is displaying two half images side by side, the issue is most likely caused by a layout or styling conflict rather than a Webflow bug.
1. Check Slider Width and Overflow Settings
- Select the Slider component and make sure its width is set to 100% or a fixed width that matches your layout.
- Ensure no parent container has overflow: hidden or display: flex/stretch behavior that could interfere with the slider's internal layout.
- Inspect the Slides wrapper element and confirm it fills the entire width of the slider (should also be 100%).
2. Review Slide Item Styles
- Select a slide (e.g., Slide 1) and make sure it has:
- Width set to 100%.
- No unexpected margin or padding pushing it off-screen.
- Repeat this check for all other slides (Slide 2, Slide 3, etc.).
3. Examine Flexbox or Grid Conflicts
- If you’re placing the slider inside a Flexbox or Grid layout, make sure:
- The parent container doesn’t restrict child sizes using align-stretch or fixed sizing.
- Slides should not be set to Display: Flex unless intentionally customized.
4. Look for Custom Code or CMS Template Issues
- If you’re using CMS items inside the slider, verify:
- The collection list wrapper isn’t conflicting with the slider’s internal structure.
- There is only one Collection List per slide, not multiple nested items.
- Double-check for any custom CSS or JavaScript that could be overriding native Webflow slider behavior.
5. Test Slide Navigation
- Use Webflow’s Preview mode to:
- Test clicking through the slides.
- Confirm whether arrows, dots, or autoplay navigation reveals more complete slides or not.
- If the issue persists, test in Incognito mode or a different browser to bypass any browser extension conflicts.
Summary
The issue of two half-visible slider images is likely due to misconfigured widths or conflicting layout styles, not a Webflow platform bug. Double-check width settings, overflow behavior, and any custom styles or CMS configurations interfering with slide layout.
