<h1 id="heading-css-layout-overflow">CSS Layout - Overflow</h1>
The CSS <code>overflow</code> property controls what happens to content that is too big to fit into an area.
CSS Overflow Property
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1686369122900/34b07896-e646-49a4-a6d6-80e276499d13.png" alt class="image--center mx-auto" />
Concept:
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1686369171778/d488c3f0-d130-40c8-a0e3-39c1ce277269.png" alt class="image--center mx-auto" />
Example:
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1686369213164/dd70fee6-105c-48a6-b69e-a0b7d3c682c6.png" alt class="image--center mx-auto" />
<hr />
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1666336375150/5HqI8zNVh.png" alt="image.png" />
Download our HTML &amp; CSS Visual Treat! ebook Here: <a target="_blank" href="https://codemarch.gumroad.com/l/hxazr">Click here</a>

# **CSS Layout - Overflow**

The CSS `overflow` property controls what happens to content that is too big to fit into an area.

**CSS Overflow Property**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1686369122900/34b07896-e646-49a4-a6d6-80e276499d13.png align="center")

Concept:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1686369171778/d488c3f0-d130-40c8-a0e3-39c1ce277269.png align="center")

Example:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1686369213164/dd70fee6-105c-48a6-b69e-a0b7d3c682c6.png align="center")

---

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1666336375150/5HqI8zNVh.png align="left")

Download our HTML & CSS Visual Treat! ebook Here: [Click here](https://codemarch.gumroad.com/l/hxazr)