Chuyển đến nội dung chính

Bài đăng

Đang hiển thị bài đăng từ Tháng 1, 2022

Canh giữa DIV với CSS

Có rất nhiều bài hướng dẫn canh giữa 1 phần tử DIV bất kỳ trong phần tử khác, nên hôm nay mình tóm tắt 1 trong số cách canh giữa phần tử DIV Có 4 điểm cần lưu ý: Dùng view port hay cho phần trăm: vh (viewport height), vw (viewport width), vmin (viewport minimum length) và vmax (viewport maximum length). Do phần tử Parent chứa child element có thể ko phải phần tử bao trùm page, nên bạn sử dụng position fixed với top = left = 0 Sử dụng margin với giá trị < 0. Để canh giữa, bạn chỉnh top = left = 50% Tại sao phải dùng viewport? Theo W3 Candidate Recommendation The viewport-percentage lengths are relative to the size of the initial containing block. When the height or width of the initial containing block is changed, they are scaled accordingly. Với ViewPort, kích thước dựa vùng xem của bạn hơn là phần tử chứa element đó. Margin với giá trị âm Áp dụng cho trường hợp bạn muốn canh giữa cho toàn bộ containter: This is by far the most common use case for negative margins. You give a cont...