1
HTML/CSSBeginner#css#flexbox
HTML/CSSAdvanced#css#float
How do you clear floats without adding extra markup?
Use the clearfix technique — a pseudo-element on the container with content: '' and clear: both — or simply set the parent to display: flow-root, which creates a new block formatting context that naturally contains floats.
Example
.container { display: flow-root; }
/* or classic clearfix */
.container::after { content: ""; display: block; clear: both; }