Mission 8: Width

เป้าหมายของ Mission นี้: จำกัดความกว้างด้วย max-width

width vs max-width

width กำหนดความกว้างตายตัว ส่วน max-width กำหนด "ความกว้างสูงสุด" — ถ้าจอแคบกว่าค่านั้น element จะหดตามจอได้ ปลอดภัยกว่าสำหรับการ์ดที่ต้องแสดงผล ได้ทั้งจอใหญ่และมือถือ

Demo

.card {
  background-color: #f8fafc;
  padding: 1.5rem;
  max-width: 24rem;
}