CSS max-height

max-height is a CSS property that allows you to set the maximum height for an element. If the content inside the element exceeds this height, it will overflow accordingly.

Let's take a look at how max-height works with some examples:

    .box {
      max-height: 100px;
      overflow: auto;
    }
  

In this example, we have a div element with a class of box that has a max-height of 100 pixels. Since the content inside the div exceeds this height, the overflow: auto property will add a scrollbar to allow users to scroll through the content.

Here's how you can achieve this in your HTML code:

    <div class="box" style="max-height: 100px; overflow: auto;">
      This is an example text that will exceed the maximum height set by the max-height property.
    </div>
  

By setting the max-height property on an element, you have better control over how the content is displayed when it exceeds a certain height.