How can I horizontally align my divs?

Question

For some reason my divs won\'t center horizontally in a containing div:

Answer 1

Using FlexBox:

  
Lorem
  
Ipsum
  
Dolor


.row {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: center; /* for centering 3 blocks in the center */
  /* justify-content: space-between; for space in between */ 
}
.block {
  width: 100px;
}

The latest trend is to use Flex or CSS Grid instead of using Float. However, still some 1% browsers don't support Flex. But who really cares about old IE users anyway ;)

Fiddle: Check Here