CSS scroll-padding-block-end
The scroll-padding-block-end property reserves space at the block-end side of a scroll container for scroll snapping and scroll-to-target behavior. In common horizontal writing, block-end usually means the bottom side.
Syntax
scroll-padding-block-end: 0;
scroll-padding-block-end: 3rem;Example
.snap-list {
overflow-y: auto;
scroll-snap-type: y mandatory;
scroll-padding-block-end: 4rem;
}This helps the final snapped position leave space for fixed controls, sticky footers or comfortable reading at the end of the container.
Logical direction
block-end depends on writing mode. In English horizontal text it usually means bottom, but in vertical writing modes it can map to another physical edge.
Use this property when the design is intended to support different writing modes. If the design only targets the physical bottom edge, scroll-padding-bottom is more explicit.