How to display the first 3 list items and hide the rest with CSS nth-child?

Viewed 55668

Is it possible to select multiple children past a defined number with CSS selectors?

I'd like to hide all list items past #3:

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li> <!-- hide this -->
  <li>5</li> <!-- hide this -->
</ul>

<style>
  ul li:nth-child(X) {
    display: none;
  }
</style>

1 Answers
Related