To vertically and horizontally center text in a div
Use the following to vertically and horizontally center text in a div using display: flex. Hello World! This is line 2… div#my_flex_example{ height: 150px; background: #ccc; display: flex; justify-content: center; align-items: center; border-radius: 15px; } div{ height: 150px; background: #ccc; display: flex; justify-content: center; align-items: center; } For maximum compatibility, add the following: display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; ref: http://stackoverflow.com/questions/16280040/css3-flexbox-display-box-vs-flexbox-vs-flex