# Overflow Settings

<figure><img src="https://lh7-us.googleusercontent.com/b3zJGUyInTbLPXwABwGNHW8DGli7e8-PwVgKtIROK1o3ZoumDmZhPRVukBgyU980Q5JRrlx7HqiRihFt3EIjSJN2h93ax5tWMVIu5KuwkWfE8xh-AhOVh8E0TV-fSeAfbDsqwlu7olvmfKecCy8j1Fg" alt=""><figcaption></figcaption></figure>

This controls what happens to your content that breaks outside of its borders.&#x20;

#### Dropdown options:&#x20;

* Auto: if the content proceeds outside its box then that content will be hidden whilst a scroll bar should be visible for users to read the rest of the content
* Visible:  content is not clipped when it proceeds outside its box
* Hidden: overflowing content will be hidden.
* Clip: content is clipped when it proceeds outside its box
* Scroll:  similar to hidden except users will be able to scroll through the hidden content.
* Inherit: sets the overflow to the value of its parent element.
* Initial: Uses the default value, which is ‘visible’
* Revert: Resets to the default value, ignoring changes made by the current style.
* Unset: Acts as ;inherit; if the property is inheritable, otherwise actis as 'initial'.&#x20;

[See an example](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_overflow)