Javascriptやtableを使わずに横並び要素の高さを揃える

Javascriptやtableを使わずに横並び要素の高さを揃える方法はいくつかありますが、
CSSを使って手軽に実装できる方法をご紹介します。

html

• デモテキストデモテキストデモテキストデモテキストデモテキスト
• デモテキスト
• デモテキストデモテキスト
• デモテキストデモテキストデモテキスト
• デモテキスト
• デモテキストデモテキストデモテキスト
• デモテキストデモテキストデモテキストデモテキストデモテキストデモテキストデモテキスト

CSS

ul.demo-list {
    width:720px;
    margin:0 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
 
ul.demo-list li {
    width:200px;
    margin:0 10px 10px 0;
    padding:15px;
    color:#000;
    background-color:#ddd;
    list-style:none;
}