grid-auto-columns

מגדיר את הגודל האוטומטי של העמודות שנוספות אוטומטית בתבנית ה-Grid.



מה זה grid-auto-columns?

המאפיין grid-auto-columns מגדיר את גודל העמודות שנוספות אוטומטית כאשר מספר העמודות בתבנית ה-Grid משתנה.

ערכים

  • size - גודל העמודות האוטומטיות, לדוגמה 100px, 1fr וכו'.

דוגמה לשימוש ב-grid-auto-columns

להלן דוגמה לשימוש במאפיין grid-auto-columns:

אלמנט 1
אלמנט 2
אלמנט 3

אפשר להגדיר את זה לדוגמה כך

    
          <style>
            .container {
              display: grid;
              grid-template-columns: repeat(2, 1fr);
              grid-auto-columns: 100px;
              gap: 10px;
            }
            .item {
              background-color: lightcoral;
              padding: 20px;
            }
          </style>
          <div class="container">
            <div class="item">אלמנט 1</div>
            <div class="item">אלמנט 2</div>
            <div class="item">אלמנט 3</div>
          </div>
        
    

עוד בקטגוריה Grid (מודל פריסת רשת)

תגובות

רק רגע

שיתוף