What is the CSS float property?

The CSS float property originally enabled text to wrap around images, similar to print layouts. An element with float: left or float: right is removed from the normal document flow and shifted to the specified side; inline content wraps around it. A common problem is that floated elements do not contribute to their parent's height — the parent "collapses." The classic fix is a clearfix hack (.clearfix::after { content: ""; display: table; clear: both; }). While floats were once the primary layout tool, modern CSS layouts use Flexbox and Grid instead. Floats are now mostly used only for their original purpose: text wrapping around images.