CSS change div order without flex

Question

given a HTML of:

1
2
3


        
      

Answer 1

There are many possibilities. The sanest, of course, is to use flex, but if you don't want that, one way is to do it like this.

.container {display: table;}
.class {display: table-row;}
.class:nth-child(3) {display: table-header-group;}
.class:nth-child(2) {display: table-footer-group;}

  
1
  
2
  
3
  
4