Embla-carousel: Blank space before last slide

[maiconrs95]

when align is start, the last slide automatically adds a blank. Is there any way to lock the last slide on the edge of the container?

[davidcetinkaya]

Hello Maicon (@maiconrs95),
Thank you for opening this issue.

Getting rid of the blank space isn't possible at the moment of writing, but I think it should be added to the Embla Carousel core. For example, we could add a new option like containScroll: boolean like so:

const options = {
  align: 'start',
  containScroll: true
}
const embla = EmblaCarousel(node, options)

Also align: 'end' is affected by this since there can be blank space at the beginning of the carousel too. However, if loop: true, containScroll should be ignored.

What do you think about my suggestion?

[davidcetinkaya]

Hello again @maiconrs95,

This feature has been released with v2.1.0. I'd very much appreciate if you could confirm if it's working as expected.

Here’s a CodeSandbox demo 🚀.

Thank you in advance 👍!

[davidcetinkaya]

Closing this due to lack of response. Feel free to reopen the issue if you don’t think it’s resolved.

Thanks!

[maiconrs95]

@davidcetinkaya,
thank you very much. Sorry for the delay to respond, but I was not following anything for a while.
Apparently it is working as proposed.
Thank you very much

[davidcetinkaya]

Hi Maicon @maiconrs95

No worries, that's understandable. I hope I didn't stress you and I'm glad it's working as you expected.

Thank you very much for opening this issue! Your idea lead to a new feature for Embla Carousel which I think is a great addition 👍.

If you're a React-person, be sure to check out the Embla Carousel React version. Here's a React CodeSandbox for it.

Cheers 👋!
David