html+div+text+align,html - CSS to vertically align text to middle of div - Stack Overflow

If your multi-line elements need to wrap for responsive reasons, then your best bet is with Flexbox. Due to the flakiness of Firefox's 2009 Flexbox implementation, it has to be handled slightly differently than you would do it for modern Flexbox implementations.

• One lorem ipsum dolor sit amet
• Two
• Three
• Four
• Five

li {

text-align: center;

vertical-align: middle;

/* fallback for non-Flexbox browsers */

display: inline-block;

/* Flexbox browsers */

display: -webkit-inline-box;

display: -moz-inline-box;

display: -ms-inline-flexbox;

display: -webkit-inline-flex;

display: inline-flex;

/* vertical centering for legacy, horizontal centering for modern */

-webkit-box-pack: center;

-moz-box-pack: center;

-ms-flex-pack: center;

-webkit-justify-content: center;

justify-content: center;

/* modern Flexbox only */

-ms-flex-align: center;

-webkit-align-items: center;

align-items: center;

/* legacy Flexbox only */

-webkit-box-orient: vertical;

-moz-box-orient: vertical;

}