Html
copy
reset
Run
Netbax Online Editor Try it Yourself
<style> #demo{ width: 200px; height: 200px; display: flex; align-items: center; } #demo div{ flex:1; border: 1px solid #000; display: flex; align-items: center; justify-content: center; color:#fff; } #auto{ background-color:#ff3800; min-height:50px; min-width:50px; align-self: auto;} </style> <p>align-self: auto you change to: stretch | flex-start | flex-end | center | auto | baseline</p> <div id="demo"> <div style="background-color:#c00;min-height:50px;min-width:50px;"></div> <div style="background-color:#008000;min-height:50px;min-width:50px;"></div> <div id="auto">auto</div> <div style="background-color:#007FFF;min-height:50px;min-width:50px;"></div> </div>
