Margin là gì?
Còn gọi: lề và khoảng cách ngoài
Margin là khoảng trống bên ngoài một phần tử, ngăn cách nó với các phần tử xung quanh; trong lưới bố cục, margin là khoảng trống giữa mép màn hình và vùng nội dung.
Hiểu kỹ hơn
Thuật ngữ có hai nghĩa thường gặp. Trong mô hình hộp CSS, mỗi phần tử có content, padding bên trong, border, rồi margin bên ngoài viền; margin đẩy các phần tử khác ra xa. Trong lưới bố cục, margin là lề trái phải của vùng nội dung, ví dụ 16px trên điện thoại, 24 đến 32px trên máy tính bảng. Figma không có thuộc tính margin cho từng đối tượng; khoảng cách giữa các phần tử được thể hiện bằng gap của auto layout, còn margin lưới đặt trong layout grid. Khi bàn giao, cần thống nhất với lập trình viên khoảng cách nào là padding của khối cha, khoảng cách nào là gap hay margin. Ví dụ: ứng dụng di động thường giữ lề 16px hai bên cho mọi màn hình để nội dung thẳng hàng. Lỗi thường gặp là mỗi màn hình một lề khác nhau, như 15, 16, 20px, khiến khi lướt qua các màn hình nội dung bị nhảy qua lại.
