Xác định một flex container và đặt các flex item vào bên trong.
Bạn có thể chạy đoạn mã sau để học cách triển khai các phần tử Flexbox. Q1, Q2, Q3 ở đây là các flex-item. Toàn bộ khu vực là phần tử Flexbox.
Ví dụ
<!DOCTYPE html> <html> <head> <style> .mycontainer { display: flex; background-color: orange; } .mycontainer > div { background-color: white; text-align: center; line-height: 40px; font-size: 25px; width: 100px; margin: 5px; } </style> </head> <body> <h1>Quiz</h1> <div class = "mycontainer"> <div>Q1</div> <div>Q2</div> <div>Q3</div> <div>Q4</div> <div>Q5</div> <div>Q6</div> <div>Q7</div> <div>Q8</div> </div> </body> </html>