html - How to give dynamic height if div added dynamically as per below reference image only by CSS? -


dynamic elements condition

how give dynamic height if div added dynamically per below reference image? want div fit in window height. i want achieve css

you can use flexbox in column flex-direction , give flex: 1 flex children - see demo below:

body {    margin: 0;  }  *{    box-sizing: border-box;  }  section {    display: inline-flex;    vertical-align: top;    width: 200px;    height: 100vh;    flex-direction: column;    border: 1px solid red;  }    section > div {    flex: 1;    border: 1px solid;    margin: 5px;  }
<section>    <div></div>    <div></div>    <div></div>  </section>    <section>    <div></div>    <div></div>    <div></div>    <div></div>  </section>


Comments

Popular posts from this blog

neo4j - finding mutual friends in a cypher statement starting with three or more persons -

php - How to remove letter in front of the word laravel -

minify - Minimizing css files -