Skip to content

fix(docs): Card examples reflow at small widths#36086

Open
smhigley wants to merge 1 commit intomicrosoft:masterfrom
smhigley:card-example-reflow
Open

fix(docs): Card examples reflow at small widths#36086
smhigley wants to merge 1 commit intomicrosoft:masterfrom
smhigley:card-example-reflow

Conversation

@smhigley
Copy link
Copy Markdown
Contributor

@smhigley smhigley commented May 2, 2026

Example-only change, no package changes.

Previous Behavior

It looks like the width and max-width styles in the example code for Card were mixed up. The behavior we want is to have the Card examples max at a certain px width, but reflow down smaller at small screen sizes or small available container widths.

e.g.:
screenshot of the appearance example showing cards getting clipped by the bounds of the example
screenshot a focusmode example showing a larger card getting clipped

New Behavior

fixed!
(there were some variations in the fixes based on the specific example layouts, but all now look the same at larger widths and collapse well at smaller widths)

Screenshot of the appearance example showing reflowing cards

Fixed for each example.

Related Issue(s)

This came up as related to an ADO issue that was closed for a separate reason.

@smhigley smhigley requested review from a team and ValentinaKozlova as code owners May 2, 2026 00:58
@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 2, 2026

📊 Bundle size report

✅ No changes found

@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 2, 2026

Pull request demo site: URL

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants