CSS Flex Box 2x2 Layout erzeugen?

Wie bekomme ich mit CSS Flexbox so ein Layout:

Answer 1

[regex9]

HTML:

<div class="container">
  <div class="box-1">Box 1</div>
  <div class="box-2">Box 2</div>
  <div class="box-3">Box 3</div>
  <div class="box-4">Box 4</div>
</div>

CSS:

.container {
  display: flex;
  flex-wrap: wrap;
}

.box-1 {
  background: red;
  width: 80%;
}

.box-2 {
  background: yellow;
  width: 20%;
}

.box-3 {
  background: green;
  width: 20%;
}

.box-4 {
  background: blue;
  width: 80%;
}

Comments

[elmex7]

Warst schneller 👍