flexGrow का उपयोग करें यह निर्धारित करने के लिए कि जावास्क्रिप्ट के साथ आइटम बाकी के सापेक्ष कितना बढ़ेगा।
उदाहरण
flexGrow के साथ काम करने का तरीका जानने के लिए आप निम्न कोड को चलाने का प्रयास कर सकते हैं संपत्ति -
<!DOCTYPE html>
<html>
<head>
<style>
#box {
border: 1px solid #000000;
width: 250px;
height: 150px;
display: flex;
flex-flow: row wrap;
}
#box div {
flex-grow: 0;
flex-shrink: 1;
flex-basis: 20px;
}
</style>
</head>
<body>
<div id = "box">
<div style = "background-color:orange;">DIV1</div>
<div style = "background-color:blue;">DIV2</div>
<div style = "background-color:yellow;" id="myID">DIV3</div>
</div>
<p>Using flexGrow property</p>
<button onclick = "display()">Set</button>
<script>
function display() {
document.getElementById("myID").style.flexGrow = "2";
}
</script>
</body>
</html>