lỗi về responsive @media

Question

Mình bị lỗi về responsive @media. Khi @media trên 900px thì nó nhận css, nhưng khi @media nhỏ hơn thì k nhận css. Đã có bác bào bị chưa, cảm ơn các bác giúp đỡ.

Answer

@media only screen and (min-width: 900px){
  //
}

Với cấu hình như này, css sẽ hoạt động trong phạm vi màn rộng từ 900px trở lên.

Còn cấu hình như dưới, css sẽ hoạt động trong phạm vi màn rộng từ 900px trở xuống.

@media only screen and (max-width: 900px){
  //
}

Answer

Tức là bạn viết reponsive cho màn dưới 900px nó không nhận? Có thể đang có đoạn code nào đó đè lên chăng, bạn thử bật f12 lên xem thử đi

Answer

tốt nhất để đảm bảo chắc chắn thì bạn chia màn hình ra một số cỡ phổ biết rồi @media theo từng cái một, như các Boostrap làm a

Answer

Bác bật f12 lên xem nó nhận đúng class và css các kiểu chưa, nếu nhận rồi mà nó bị gạch ngang ở các đoạn css đó thì bác có thể thêm thuộc tính !important

Answer

bạn thêm link <meta name="viewport" content="width=device-width, initial-scale=1"> này vào chưa

5 CÂU TRẢ LỜI