Bad home page layout after uploading a profile with a long name

[mstange]

[julienw]

These 2 columns are defined with 1fr 1fr. I'm not sure what the rules are when the content is bigger than these defined values.

[julienw]

Looks like that 1fr means minmax(auto, 1fr), and auto depends on the content unless min-width is used. I think that the fix is to use minmax(0, 1fr) (and possibly adding some overflow:hidden and ellipsis for the text to look good)

[mstange]

Seems like we could just set min-width: 0 on the section, then?

I've been thinking that it might be nice to have a general lint that suggests setting min-width/height: 0 on any flex child element which has a width or height set, and something similar for grid.

[julienw]

Seems like we could just set min-width: 0 on the section, then?

Both fixes would work, yeah. I think I prefer to use minmax because then the layout-related CSS is contained only in one area, but I'm not too strongly opinionated.
Edit: looks like you did this fix in Tooltip.css in the past too :-)

I've been thinking that it might be nice to have a general lint that suggests setting min-width/height: 0 on any flex child element which has a width or height set, and something similar for grid.

I guess that's what we usually want indeed but that doesn't seem easy to write.