<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla a condimentum nulla. In faucibus nisl sed blandit molestie. Nulla nec orci sed ex pretium pulvinar et vitae quam. Sed dignissim fringilla nisi. Maecenas dapibus tellus mi. Nam urna neque, accumsan posuere convallis ac, semper eu elit. Donec eu nisl non risus viverra feugiat. Phasellus in nibh nisi. Suspendisse posuere molestie risus non ornare. Curabitur malesuada suscipit ipsum eget vehicula.</p>
<div class="someClass">
  <div class="element">
    <p>Fusce vel massa vel diam porttitor tincidunt id quis neque. Aliquam id justo lacinia, maximus enim vel, pharetra elit. Curabitur eu bibendum massa. Quisque rhoncus libero neque, vel consequat diam interdum non. Morbi porttitor, ipsum a volutpat blandit, ipsum tellus mattis libero, sed tempus ex tellus in urna. Maecenas feugiat tempus sem, nec feugiat ligula mollis a. Pellentesque eleifend suscipit nunc, vitae cursus quam ornare fermentum. Sed facilisis, tortor eget sodales blandit, justo massa finibus dui, nec pretium metus purus sed massa. Suspendisse potenti. Sed ullamcorper ut lacus a venenatis.</p>
  </div>
  <div class="element">
    <p>Nullam molestie ex at tortor commodo, a interdum eros pulvinar. Praesent consequat venenatis lorem eget pharetra. Mauris tristique velit a mauris hendrerit, et dignissim massa rhoncus. Nulla non urna vitae lorem egestas hendrerit. Aenean aliquet ex ut rutrum aliquam. Nam eget sollicitudin mauris. Mauris luctus laoreet gravida. Ut congue orci sit amet nunc scelerisque, viverra tincidunt nisi venenatis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut magna lorem, mollis consectetur nulla id, cursus lobortis lectus. Sed sit amet neque ac lectus porta tristique ut a quam. Fusce sit amet augue pretium, varius magna a, pellentesque libero. Aenean egestas vel purus sit amet maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aenean eu justo massa. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
  </div>
  <div class="element">
    <p>In fringilla ipsum molestie augue elementum, sit amet luctus tellus mollis. Integer malesuada est vel tortor suscipit, vitae iaculis tellus hendrerit. Donec vitae sapien lacus. Curabitur vehicula convallis volutpat. Integer et tortor non lorem vulputate rhoncus et nec arcu. Curabitur at consequat enim. Maecenas dictum nunc a nibh ornare malesuada. Etiam fermentum nulla libero, non dapibus mauris rhoncus ac. Fusce id nisi quis dolor ornare lobortis. Suspendisse sit amet ante at neque ultricies fermentum. Vivamus tincidunt quis nunc vitae feugiat. Donec ullamcorper finibus rhoncus. Quisque semper gravida semper. In in euismod ante.</p>
  </div>
  <div class="element">
    <p>Nullam molestie ex at tortor commodo, a interdum eros pulvinar. Praesent consequat venenatis lorem eget pharetra. Mauris tristique velit a mauris hendrerit, et dignissim massa rhoncus. Nulla non urna vitae lorem egestas hendrerit. Aenean aliquet ex ut rutrum aliquam. Nam eget sollicitudin mauris. Mauris luctus laoreet gravida. Ut congue orci sit amet nunc scelerisque, viverra tincidunt nisi venenatis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut magna lorem, mollis consectetur nulla id, cursus lobortis lectus. Sed sit amet neque ac lectus porta tristique ut a quam. Fusce sit amet augue pretium, varius magna a, pellentesque libero. Aenean egestas vel purus sit amet maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aenean eu justo massa. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
  </div>
  <div class="element">
    <p>Proin quam orci, elementum a pulvinar a, consectetur sed leo. Cras imperdiet sed ante quis suscipit. In semper lectus nec varius convallis. Mauris varius lorem nec augue faucibus vehicula. Pellentesque id pharetra eros, ac lacinia elit. Sed consectetur semper dignissim. Sed eu nulla porta diam condimentum mollis. Nullam vitae arcu sed dolor volutpat ullamcorper. Nunc id maximus velit. Donec laoreet, elit nec efficitur consequat, mi diam posuere nisl, sed egestas ipsum urna sed arcu. Praesent ullamcorper lectus ut nulla commodo, tincidunt sodales velit dictum. Morbi tempus pretium ligula, vitae commodo nisi pulvinar nec. Praesent eget placerat sem. Integer fringilla, tellus in hendrerit mollis, urna elit tempor massa, at dictum sapien tellus nec urna. Fusce ut lectus tempus, aliquam sem non, pharetra elit.</p>
  </div>
  <div class="element">
    <p>Curabitur at orci felis. Aliquam ut imperdiet arcu. Phasellus pharetra vestibulum gravida. Ut et massa eu felis fermentum ultricies. Ut consequat hendrerit varius. Cras vel nulla nec libero rutrum facilisis. Vivamus magna purus, commodo nec elementum a, sodales sed urna. Phasellus mauris urna, convallis in commodo non, accumsan at velit. Vivamus vitae euismod ex. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Mauris sagittis ante lacus. Duis accumsan bibendum tempus.</p>
  </div>
  <div class="element">
    <p>Aenean non leo volutpat, pulvinar mauris eget, blandit nunc. Maecenas fringilla odio sit amet elit ornare, eleifend luctus lectus finibus. Ut viverra sapien vel purus accumsan, vitae interdum augue auctor. Cras odio sem, imperdiet in dui vitae, lobortis efficitur massa. Proin pellentesque odio in efficitur imperdiet. Vestibulum iaculis id risus mollis placerat. Aliquam non ligula et lorem mollis posuere eget in massa. Suspendisse vitae mi sed nisl vestibulum rhoncus. Phasellus vel enim purus. Integer felis quam, hendrerit vel congue sodales, ullamcorper ut neque. Donec mollis quam metus.</p>
  </div>
  <div class="element">
    <p>Quisque nisi nisi, lacinia sed ligula eget, iaculis efficitur nisl. Pellentesque volutpat suscipit ultricies. Nam volutpat leo at vehicula euismod. Donec mi justo, fringilla at ultricies non, suscipit ultrices lacus. Cras sagittis dapibus metus nec molestie. Sed eleifend faucibus nisl, sed vulputate odio faucibus eget. Sed pulvinar eros nec urna consectetur vestibulum. Donec congue malesuada augue, vestibulum laoreet augue tincidunt quis. In dapibus feugiat egestas. Quisque dolor ex, scelerisque ac tempus eget, posuere eu enim. Suspendisse at odio mattis, commodo ante ut, vehicula sapien.</p>
  </div>
</div>
.someClass {
  max-height: 350px;
  overflow-y: auto;
  border: 1px solid;
  padding: 5px;
}
.element {
  display: block;
  padding: 0 5px;
  border: 1px dashed;
  margin: 5px 0;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.