<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>
*{margin:0;padding:0;}
ul{display:flex;list-style:none;flex-direction:column;background:#ccc;}
li{width:100px;height:100px;border:1px solid #000;}
li:nth-child(1){background:pink;}
li:nth-child(2){background:red;}
li:nth-child(3){background:blue;}
li:nth-child(4){background:green;}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.