La propriété CSS max-height permet de définir une hauteur maximale aux éléments sur lesquels elle est appliquée.

#mon_identifiant{
max-height:50px;
}

    Elle prend comme valeurs :

    • numérique en pixel (px), pourcentage (%), en point(pt) ou en em.
    • inherit, hérite de son parent.

    Exemple :

    CSS
    p{
    max-height:100px;
    background-color:chocolate;
    overflow-y:scroll;
    }
    
    HTML
    <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce pulvinar dolor vel augue porta vestibulum. Aenean malesuada nibh eu erat elementum fringilla sed quis diam. Maecenas vel ante nisl. Morbi iaculis velit metus, nec elementum lorem. Nullam quis ultricies nunc. Sed ullamcorper, lacus sit amet tincidunt tincidunt, arcu nisi viverra nibh, eu tristique risus velit vitae mauris. Sed odio quam, euismod sit amet posuere sit amet, interdum et justo. Fusce venenatis sollicitudin tempus. Donec urna nisl, molestie eu elementum ac, gravida sit amet erat. Donec ligula ante, dapibus in cursus ac, commodo ac velit. Aenean ultricies convallis turpis ut rutrum. Donec vitae eros non mauris tempus egestas. Etiam sit amet elit nulla, vitae tempus nisi. Suspendisse blandit massa a leo aliquet fringilla.
    
    Nulla facilisi. Morbi eu nulla est, non rutrum urna. Fusce sagittis faucibus nulla et aliquam. Cras dictum justo ut ipsum suscipit gravida. Nulla elit purus, pharetra eu feugiat sit amet, malesuada et nibh. Vestibulum et leo magna, sed molestie nulla. Vestibulum orci est, pellentesque at elementum at, eleifend a erat. Pellentesque sit amet orci vel nunc fringilla aliquam. Nunc nec eros eros, a pharetra nibh. Aliquam congue orci vulputate felis posuere nec egestas lacus eleifend. Aliquam viverra nunc a elit fermentum eleifend. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
    </p>
    

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce pulvinar dolor vel augue porta vestibulum. Aenean malesuada nibh eu erat elementum fringilla sed quis diam. Maecenas vel ante nisl. Morbi iaculis velit metus, nec elementum lorem. Nullam quis ultricies nunc. Sed ullamcorper, lacus sit amet tincidunt tincidunt, arcu nisi viverra nibh, eu tristique risus velit vitae mauris. Sed odio quam, euismod sit amet posuere sit amet, interdum et justo. Fusce venenatis sollicitudin tempus. Donec urna nisl, molestie eu elementum ac, gravida sit amet erat. Donec ligula ante, dapibus in cursus ac, commodo ac velit. Aenean ultricies convallis turpis ut rutrum. Donec vitae eros non mauris tempus egestas. Etiam sit amet elit nulla, vitae tempus nisi. Suspendisse blandit massa a leo aliquet fringilla.

    Nulla facilisi. Morbi eu nulla est, non rutrum urna. Fusce sagittis faucibus nulla et aliquam. Cras dictum justo ut ipsum suscipit gravida. Nulla elit purus, pharetra eu feugiat sit amet, malesuada et nibh. Vestibulum et leo magna, sed molestie nulla. Vestibulum orci est, pellentesque at elementum at, eleifend a erat. Pellentesque sit amet orci vel nunc fringilla aliquam. Nunc nec eros eros, a pharetra nibh. Aliquam congue orci vulputate felis posuere nec egestas lacus eleifend. Aliquam viverra nunc a elit fermentum eleifend. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.