ampproject / ampproject/amphtml
amp-base-carousel – Images after the first slide don’t fill full width (leave margins on left/right)
- Dominant language
- JavaScript
- Stars
- 14.9k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
I’m using in a responsive layout and noticed an issue:
### Expected Behavior
- Each image should fully fill the carousel width when it is active, the same as the first slide.
### Actual behavior
- The first image fills the width as expected.
- From the second image onward, there is extra space (padding/margin) visible on the left and right, so the image doesn’t fully span the container.
- The images are all the same dimensions and have layout="responsive", so this seems to be a carousel rendering/layout bug.
### Reproduction Steps
Steps to reproduce:
1. Go to https://playground.amp.dev/
2. Copy Paste this code inside body tag
`
`
> nothing to worry, the code is huge because of the image link, it is just amp-base-carousel with three amp-img src
> If image does not open, try with different image link you can find online
Notice how on sliding to next image after first changes the dimension on left right side.
### Relevant Logs
```shell
```
### Browser(s) Affected
Edge
### OS(s) Affected
_No response_
### Device(s) Affected
all devices show same behaviour
### AMP Version Affected
_No response_
Contributor guide
Research direction
Start by reproducing the issue in playground.amp.dev with the provided amp-base-carousel and three amp-img elements, then trace the amp-base-carousel rendering and layout behavior as the active slide changes. Done means every responsive image fills the carousel width consistently, including slides after the first.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100