1
2
3
4
5
CSS
.flexbox { display: flex; } .lohko1 { flex-shrink: 4; /* pienennetään nelinkertaisesti .lohko2 verrattuna */ border: 3px solid black; width: 20em; } .lohko2 { flex-shrink: 1; border: 3px solid red; width: 20em; } .lohko3 { border: 3px solid green; flex-shrink: 0; /* 1 on oletusarvo, 0 tarkoittaa, että ei pienennetä */ width: 30em; }
HTML
<div class="flexbox"> <div class="lohko1">1</div> <div class="lohko2">2</div> <div class="lohko1">3</div> <div class="lohko2">4</div> <div class="lohko3">5</div> </div>
Javascript
Konsoli