Computer scienceFrontendCSSFlexbox

Flexibility, growth and contraction ratio

Theory

Flex-grow

Report a typo

Make each section bigger than the previous one by giving it a bigger part of the remaining free space. Use the flex-grow property and make the sum of the values equal to 10.

Tip: The flex-grow property value of the first section plus the flex-grow value of the second section plus ... = 10

Write HTML and CSS code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Flex-shrink</title>
</head>
<body>
<div class="menu">
<div class="menu-item item1">Home</div>
<div class="menu-item item2">Catalog</div>
<div class="menu-item item3">Cart</div>
<div class="menu-item item4">Profile</div>
</div>
</body>
</html>
Completed 0 of 4
First section handled
Second section handled
___

Create a free account to access the full topic