The child element extends the parent element to a certain width, and the size of the child element is irregular.

the width of the parent element is stretched out by the child element, but when it reaches the position in figure 1, it becomes possible to scroll
the size of the child element is irregular
can you do it with pure css? can you do that twice when I met with js and recently encountered this problem in the interview? the interviewer said there is a simple way
you can help me figure it out

Css
Mar.06,2021

to the specified width, you can use max-width
to force no line wrapping. You can use display:flex; flex-flow: row nowrap
. The idea is something like this

.
Menu