Flex Items

<!DOCTYPE html>
<html>
<head>
    <style>
        .kontainer { display: flex; gap: 10px; background: #e2e8f0; padding: 10px; }
        .kotak-tetap { width: 100px; background: #94a3b8; padding: 15px; text-align: center; }
        .kotak-melar { flex-grow: 1; background: #04AA6D; color: white; padding: 15px; text-align: center; }
    </style>
</head>
<body>
    <div class="kontainer">
        <div class="kotak-tetap">100px</div>
        <div class="kotak-melar">flex-grow: 1 (Otomatis Melar)</div>
    </div>
</body>
</html>