How to place these blocks?

I want to layout the first layout,but I don't know how to mark up the data blocks that it was most correct.
gclipUZnARw.jpg
I was going to take in total divas.
then 1 row 2 diva. Say 1 unit width 33% second 66%
2 line 3 diva,hang the same class
on line 3 same as 1
line and 4 similar to 2.
to zaplatiti this case to the left.
But I think that is too curve option is so much better
July 2nd 19 at 17:23
2 answers
July 2nd 19 at 17:25
it is better to make div with width 100% and ask him a background. and the blue block in 33% inside stuff.
If you do the background, I 1 the background will be hidden 33% of the picture? - sigrid.Mann commented on July 2nd 19 at 17:28
Yes. but when you adapt it will look much prettier than to do it in 2 float: left bloc - Rosendo_Hess commented on July 2nd 19 at 17:31
: can flex then? - sigrid.Mann commented on July 2nd 19 at 17:34
: what's the difference as their siting. though using inline-block. though using display: table. it will be 2 different blocks. and I suggest to make the background 100% but a small block to put in it - Rosendo_Hess commented on July 2nd 19 at 17:37
July 2nd 19 at 17:27
.col-13 {float:left; width: 33.3333%;}
.col-23 {float:left; width: 66.66666%;}


<div class="row">
<div class="col-13"> </div>
<div class="col-23"> </div>
</div>
<div class="row">
<div class="col-13"> </div>
<div class="col-13"> </div>
<div class="col-13"> </div>
</div>
<div class="row">
<div class="col-23"> </div>
<div class="col-13"> </div>
</div>

Find more questions by tags CSSHTML