ماذا تفعل overflow: hidden في CSS؟

overflow: hidden يخفي المحتوى الزائد الذي يتجاوز حدود العنصر، دون شريط تمرير:

.card {
  border-radius: 12px;
  overflow: hidden;   /* the image corners follow the card's rounded corners */
}

القيم الأخرى

• visible: الافتراضي، المحتوى الزائد يظهر خارج العنصر.
• auto: شريط تمرير عند الحاجة فقط.
• scroll: شريط تمرير دائمًا.

انتبه

الإخفاء قد يقص محتوى مهمًا أو قوائم منسدلة. ولقص نص طويل بثلاث نقاط:

.title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }