מה זה min-height?

המאפיין min-height ב-CSS קובע את הגובה המינימלי של האלמנט. הוא משמש להבטיח שהאלמנט לא יתכווץ מתחת לגובה מסוים, גם אם הגובה של האלמנט הוגדר באחוזים או בערכים אחרים.

שימוש במאפיין min-height

באמצעות min-height ניתן למנוע מהאלמנט להתכווץ מתחת לגובה מסוים, דבר שיכול להיות שימושי בעיצובים רגישים (responsive) או כשיש צורך לשמור על עיצוב מסוים.

דוגמה לשימוש ב-min-height

להלן דוגמה לשימוש במאפיין min-height:

בדוגמה זו, האלמנט לא יתכווץ מתחת לגובה של 150 פיקסלים, גם אם גובה התוכן קטן יותר.

שימושים מתקדמים

באמצעות min-height ניתן לשלוט בעיצוב פריסות רגישות (responsive) ולשמור על גובה מינימלי של האלמנט בעיצובים משתנים.

    <div style="min-height: 150px; width: 100%; border: 2px solid black; background: lightyellow;">
                    תוכן עם גובה מינימלי של 150 פיקסלים
                  </div>