What is the CSS box model?

The CSS box model describes how the dimensions of an HTML element are calculated and displayed on a webpage. It consists of four main sections: content, which holds the actual content like text or images; padding, the space between the content and the element's border; border, which wraps around the padding; and margin, the outermost area that separates the element from others. This model helps in managing the spacing and size of elements effectively.