/CSS/Use flex in container with multiple components

Use flex in container with multiple components

.wrap {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;         /* NEW */
  height: 100px;                  /* NEW */
  justify-content: space-between; /* NEW */
}
.elem1 {
  width: 20%;
  flex-basis: 100%;               /* NEW */
  border: 1px solid red;
}
.elem2,
.elem3 {
  width: 75%;
  flex-basis: 40%;                /* NEW */
  border: 1px solid red;
}

Source: stackoverflow.com

Similar codes

4 votes278 views1 answer
Orientation css max and min width media query
CSS
0 vote307 views2 answers
Preloader css
CSS
0 vote263 views1 answer
Style image so it crops
CSS
27 votes276 views1 answer
How to set text color in ingredient
CSS
3 votes270 views2 answers
How to split a background into two color in css
CSS
182 votes400 views6 answers
How to link css to html
CSS
0 vote281 views1 answer
Css nth child range
CSS
0 vote278 views2 answers
Css prevent scrolling behind overlay
CSS
0 vote264 views1 answer
Html css drow line
CSS
2 votes256 views2 answers
Bootstrap icons in angular
CSS