v5.3 regression: table clips container's rounded border
Nobody has claimed this yet.
- Dominant language
- MDX
- Stars
- 175k
- Forks
- 78.6k
- Avg merge
- 7h 19m
- Merged PRs (30d)
- 35
Description
Prerequisites
- I have searched for duplicate or closed issues
- I have validated any HTML to avoid common problems
- I have read the contributing guidelines
Describe the issue
When upgrading from Bootstrap v5.2 to v5.3, tables inside a container with rounded borders (such as the card component) have a piece visibly missing from the rounded borders at the top where it did not do so in previous versions of Bootstrap. The difference is subtle so you may have to zoom into the corner to see it on the screenshots.
Reduced test cases
v5.2 (expected appearance): https://codepen.io/Grant-Bourque/pen/bNVOLVQ
v5.3 (unexpected appearance, same on latest version): https://codepen.io/Grant-Bourque/pen/xbwmYRg
What operating system(s) are you seeing the problem on?
macOS
What browser(s) are you seeing the problem on?
Firefox
What version of Bootstrap are you using?
v5.3.8
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked v5.2 and v5.3 CodePen reduced test cases in Firefox and compare the table and rounded container styling. Trace the Bootstrap CSS rules responsible for the top corners; the issue is done when the v5.3 appearance no longer clips the container's rounded border for the reproduced markup.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100