Cho <div class="page"> cao 500px chứa theo thứ tự: <header class="top">, <div class="middle">, <footer class="bottom">. Bên trong .middle gồm <aside class="left">, <main class="content">, <aside class="right">.

Viết CSS để:

.page là flex-direction: column chiếm đủ 500px
.top và .bottom giữ chiều cao tự nhiên không co (flex-shrink: 0)
.middle chiếm hết khoảng trống còn lại giữa header và footer (flex: 1) và là flex hàng ngang
Trong .middle, .left và .right có chiều rộng cố định 120px không co giãn (flex: 0 0 120px), còn .content chiếm hết phần chiều rộng còn lại (flex: 1)

Đề bài: [Thiết kế Web] Bố cục Holy Grail đơn giản với 2 sidebar cố định

Thư Mục

Console