How to make the overflow CSS property work with hidden as value?

Spread the love

Sometimes, we want to make the overflow CSS property work with hidden as value.

In this article, we’ll look at how to make the overflow CSS property work with hidden as value.

How to make the overflow CSS property work with hidden as value?

To make the overflow CSS property work with hidden as value, we should set the element’s parent and ancestor elements to have the same style.

For instance, we write

<div style="overflow: hidden">
  <div style="overflow: hidden">
    some text that should not overflow
    <div></div>
  </div>
</div>

to have overflow: hidden in the child and the parent div so that the child div’s text won’t overflow.

Conclusion

To make the overflow CSS property work with hidden as value, we should set the element’s parent and ancestor elements to have the same style.

Leave a Reply

Your email address will not be published. Required fields are marked *