twbs / bootstrap

The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
https://getbootstrap.com
MIT License
170.25k stars 78.77k forks source link

Grid with gutter add extra space on column break. #40702

Open florianlacreuse opened 1 month ago

florianlacreuse commented 1 month ago

Prerequisites

Describe the issue

When we use a column break .w-100 inside a grid with a vertical gutter, the .w-100 spacer / braker add an unwanted extra vertical space.

Reduced test cases

https://codepen.io/florianlacreuse/pen/vYqZPJO

What operating system(s) are you seeing the problem on?

Linux

What browser(s) are you seeing the problem on?

Chrome, Firefox

What version of Bootstrap are you using?

5.3.3

florianlacreuse commented 1 month ago

This css selector seems too strong.

julien-deramond commented 1 month ago

This css selector seems too strong.

This was mentioned in another issue at https://github.com/twbs/bootstrap/issues/39946, but without a reproducible example. There's maybe something to improve with this selector.

webprogrammierer commented 1 month ago

Original issue: https://github.com/twbs/bootstrap/issues/39946

florianlacreuse commented 1 month ago

If it's a headache to find a better css selector, we could change the documentation from w-100 only to w-100 p-0 m-0. Just a simple suggestion, let me know what you think.