/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

29 votes148 views3 answers
How to remove scrollbar in css
CSS
0 vote149 views2 answers
Also define the standard property 'background-clip' for compatibility
CSS
0 vote159 views1 answer
Width calc(100 - 100px)
CSS
3 votes142 views3 answers
Have background color and background image css
CSS
2 votes150 views2 answers
How to serve css in golang
CSS
0 vote149 views1 answer
List style type none still leaves room for bullet
CSS
12 votes161 views6 answers
Responsive text
CSS
49 votes192 views3 answers
Center absolute element css
CSS
9 votes213 views3 answers
Bootstrap list
CSS Bootstrap
1 vote178 views2 answers
Change the weight of a bold font css
CSS