תאור המאפיין align-content


קובע את היישור של התוכן הפנימי בתוך אובייקט אחר כאשר הפריטים שבתוך המכולה אינם משתמשים בכל השטח הפנימי.


קוד לדוגמה המציג את המאפיין align-content


<!DOCTYPE html>
<html>
<head>
    <title>כותרת האתר</title>
<style>
#main {
    width: 70px;
    height: 300px;
    border: 1px solid #303030;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: center;
    align-content: center;
}

#main div {
    width: 70px;
    height: 70px;
}
</style>
<meta charset="utf-8"/>
</head>
<body>
    <div id="main">
        <div style="background-color:blue; "></div>
        <div style="background-color:red; "></div>
        <div style="background-color:green; "></div>
    </div>
</body>
</html>

תמיכה בדפדפנים למאפיין align-content


chrome logo
explorer logo
edge logo
firefox logo
safari logo
opera logo
21.0
11.0
כן
28.0
9.0
12.1

המספר מתחת לאייקון של הדפדפנים מציין את הגרסה הראשונה שבה נתמכת המאפיין.


גרסת css למאפיין align-content


3


תכונות למאפיין align-content


centerנעדכן בקרוב את תאור הערך.
flex-endנעדכן בקרוב את תאור הערך.
flex-startנעדכן בקרוב את תאור הערך.
inheritמגדיר את הערך שיורש מההורה.
initialמגדיר את המאפיין לערך ברירת המחדל שלו.
space-aroundנעדכן בקרוב את תאור הערך.
space-betweenנעדכן בקרוב את תאור הערך.
stretchנעדכן בקרוב את תאור הערך.
timeנעדכן בקרוב את תאור הערך.

השאר תגובה