Skip to content

Images align to the right when total images width is less than container width in @splidejs/svelte-splide #14

Open
@VladyslavForm

Description

@VladyslavForm

Checks

Version

0.2.9

Description

I'm currently utilizing the @splidejs/svelte-splide package for a full-width slider in my Svelte application, closely resembling the "No Paging" layout described in the Splide documentation.

The slider functions as expected both with multiple images and with a single image (it correctly centers it within the container).
Slider-with-lots-of-images
Slider-with-one-image

However, I've encountered an issue where if the total width of the images is less than the width of the Splide container, the images unexpectedly align to the right instead of the expected left alignment. Additionally, in this state, it's possible to manually scroll (swipe) the images from their right alignment to the left, which is not the intended behavior.
Slider-with-alignment-issue

Reproduction Link

No response

Steps to Reproduce

  1. Implement a Splide slider with the "No Paging" layout option in a Svelte application using @splidejs/svelte-splide.
  2. Add images to the slider (approximately 2) where their total width is less than the Splide container's width.
  3. Observe the alignment and scrolling behavior of the images.

Expected Behaviour

Images should align to the left of the Splide container when their total width is less than the container's width, with no ability to manually scroll them.

Slider-expected-behaviour

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions