<style>
.exemple-ms-flex-direction-column { -ms-flex-direction : column; border-color:#2a712a; }
.exemple-ms-flex-direction-row { -ms-flex-direction : row; border-color:#666; }
.exemple-direction-rtl{ direction : rtl; }
.exemple-writing-mode-lr { -ms-writing-mode : tb-lr; }
.exemple-writing-mode-rl { -ms-writing-mode : tb-rl; }
.exemple-flex-container { display : -ms-flexbox; -ms-flex-wrap : wrap; width:400px; height:auto; }
.exemple { border-width:1px; border-style:solid; margin-bottom:10px; padding:5px; }
.exemple-flex-item { border:1px dotted #666; display:block; height : auto; width : auto; -ms-flex : 1 1 auto; }
.exemple-ms-flex-direction-column .exemple-flex-item { -ms-flex : 1 1 auto; }
</style>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-column">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : column; </b> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : column; </b> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : column; </b> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</span >
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-column exemple-direction-rtl">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : column; <br> direction : rtl; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : column; <br> direction : rtl; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : column; <br> direction : rtl; </b></span>
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-column exemple-writing-mode-lr">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : column; <br>-ms-writing-mode : tb-lr; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : column; <br>-ms-writing-mode : tb-lr; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : column; <br>-ms-writing-mode : tb-lr; </b></span>
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-column exemple-writing-mode-rl">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : column; <br>-ms-writing-mode : tb-rl; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : column; <br>-ms-writing-mode : tb-rl; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : column; <br>-ms-writing-mode : tb-rl; </b></span>
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-row">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : row; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : row; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : row; </b></span>
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-row exemple-direction-rtl">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : row; direction : rtl; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : row; direction : rtl; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : row; direction : rtl; </b></span>
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-row exemple-writing-mode-lr">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : row; <br>-ms-writing-mode : tb-lr; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : row; <br>-ms-writing-mode : tb-lr; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : row; <br>-ms-writing-mode : tb-lr; </b></span>
</div>
<div class="exemple exemple-flex-container exemple-ms-flex-direction-row exemple-writing-mode-rl">
<div class="exemple-flex-item">1 ) <b>-ms-flex-direction : row; <br>-ms-writing-mode : tb-rl; </b></div>
<p class="exemple-flex-item">2 ) <b>-ms-flex-direction : row; <br>-ms-writing-mode : tb-rl; </b></p>
<span class="exemple-flex-item">3 ) <b>-ms-flex-direction : row; <br>-ms-writing-mode : tb-rl; </b></span>
</div>
2 ) -ms-flex-direction : column; Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
3 ) -ms-flex-direction : column; Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.2 ) -ms-flex-direction : column;
direction : rtl;
2 ) -ms-flex-direction : column;
-ms-writing-mode : tb-lr;
2 ) -ms-flex-direction : column;
-ms-writing-mode : tb-rl;
2 ) -ms-flex-direction : row;
3 ) -ms-flex-direction : row;2 ) -ms-flex-direction : row; direction : rtl;
3 ) -ms-flex-direction : row; direction : rtl;2 ) -ms-flex-direction : row;
-ms-writing-mode : tb-lr;
2 ) -ms-flex-direction : row;
-ms-writing-mode : tb-rl;