Float with 4 boxes

by Danny_Joris

HTML

<div class="wrapper">
    <div class="box-1 left">box 1<br>box 1<br>box 1</div>
    <div class="box-2 right">box 2<br>box 2<br>box 2<br>box 2</div>
    <div class="box-4 right">box 4</div>
    <div class="box-3 left">box 3</div>

</div>

CSS

.wrapper {
    
}

.wrapper > div {
    color: white;
}

.box-1 {
    background-color: lightgreen;
}

.box-2 {  
    background-color: lightblue;
}

.box-3 {
    background-color: orange;
}

.box-4 {
    background-color: purple;
}

.left {
  float: left;
  width: 75%;
  margin-right: 0;
  margin-left: 0;
}

.right {
  float: right;
  width: 25%;
  margin-left: 0;
  margin-right: 0;
}