# Giới hạn kích thước

#### 1. Mục tiêu

Giúp người thiết kế thiết lập các ngưỡng giới hạn an toàn cho kích thước của thành phần. Mục tiêu chính là ngăn chặn việc giao diện bị vỡ, bị bóp quá nhỏ hoặc bị giãn quá mức khi người dùng xem trang trên các màn hình có độ phân giải khác nhau (từ điện thoại nhỏ đến màn hình máy tính siêu rộng).

#### 2. Khi nào dùng

Bạn nên sử dụng bộ đôi Min/Max Width & Height làm "bí kíp" trong các kịch bản sau:

* Bảo vệ nút bấm và icon: Đặt Min Width (ví dụ: 300px) để đảm bảo các nút bấm hoặc ô nhập liệu không bao giờ bị thu nhỏ đến mức khó thao tác trên điện thoại di động.
* Kiểm soát hình ảnh: Đặt Max Width cho các hình ảnh hoặc biểu ngữ để chúng không bị giãn ra quá to, gây vỡ ảnh hoặc làm mất thẩm mỹ trang web trên màn hình máy tính lớn.
* Cố định khung nội dung: Sử dụng Max Width (ví dụ: 1200px) cho toàn bộ Section chính để nội dung luôn nằm tập trung ở giữa trang, không bị tràn ra sát mép màn hình.
* Duy trì khoảng trống: Sử dụng Min Height cho các Section trống hoặc Section chứa video để đảm bảo chúng luôn có một không gian hiển thị tối thiểu, không bị sụp khung khi nội dung chưa kịp tải.

#### 3. Các bước thực hiện

Để thiết lập các giới hạn kích thước, bạn thực hiện theo trình tự sau:

* Bước 1: Chọn thành phần hoặc khối nội dung bạn muốn bảo vệ cấu trúc trên giao diện builder.
* Bước 2: Tại bảng thuộc tính bên phải, tìm đến mục Min/Max Size.
* Bước 3: Nhập giá trị mong muốn vào các ô tương ứng:
  * Min Width/Height: Nhập số px để thiết lập ngưỡng nhỏ nhất (Ví dụ: 300px).
  * Max Width/Height: Nhập số px để thiết lập ngưỡng lớn nhất (Ví dụ: 800px).
* Bước 4: Quan sát sự thay đổi và thử co giãn cửa sổ trình duyệt (hoặc chuyển đổi giữa các chế độ xem thiết bị) để thấy cách các giới hạn này hoạt động.
* Bước 5: Điều chỉnh lại các chỉ số nếu thấy thành phần bị cứng nhắc quá mức hoặc vẫn chưa đạt độ cân đối mong muốn.

#### 4. Lưu ý

* Kết hợp linh hoạt: Bạn có thể để chiều rộng là Auto (Tự động) nhưng hãy đặt Max Width để thành phần đó vừa có thể co giãn linh hoạt vừa không bao giờ vượt quá kích thước cho phép.
* Tối ưu di động: Hãy chú ý đặc biệt đến Min Width. Nếu bạn đặt thông số này quá lớn (ví dụ: 500px), nó sẽ gây ra lỗi tràn màn hình ngang trên các dòng điện thoại thông minh vốn chỉ có chiều rộng khoảng 375px - 414px.
* Đồng bộ hóa: Nên sử dụng các ngưỡng giới hạn giống nhau cho các thành phần cùng loại (như tất cả các Card ứng viên trong danh sách) để tạo sự đồng bộ chuyên nghiệp.
* Kiểm tra hiển thị: Luôn kiểm tra kỹ cả hai ngưỡng (Min và Max) để chắc chắn rằng nội dung bên trong (chữ, ảnh) vẫn hiển thị đẹp mắt và không bị cắt mất khi các giới hạn này được kích hoạt.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mhiring.vn/mcms/thiet-ke-van-ban/kich-thuoc-van-ban/gioi-han-kich-thuoc.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.