2.5.2

Spalten mit verschiedenen Breiten

<div class="layout">
    <div class="cell-1">
        <img src="characters/a.png">
    </div>
    <div class="cell-3">
        <img src="characters/b.png">
    </div>
    <div class="cell-2">
        <img src="characters/b.png">
    </div>
    <div class="cell-2">
        <img src="characters/b.png">
    </div>
</div>

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

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

.layout .cell-1 {
    width: 25%;
}

.layout .cell-2 {
    width: 50%;
}

.layout .cell-3 {
    width: 75%;
}

.layout img {
    width: 100%;
}

@media (max-width: 800px) {
    .layout {
        flex-direction: column;
    }

    .layout .cell-1, .layout .cell-2 {
        width: 100%
    }
}