<!DOCTYPE html>
<html>
<head>
<style>
#container {
display: grid;
grid-template-columns: fit-content(250px) fit-content(250px) auto;
grid-gap: 7px;
box-sizing: border-box;
height: 150px;
width: 100%;
background-color: green;
padding: 7px;
}
#container > div {
background-color: beige;
padding: 5px;
}
</style>
</head>
<body>
<h1>The fit-content() Function</h1>
<div id="container">
<div>Some text. Some text.</div>
<div>Some more text. Because the content of this div is wider than the maximum width, it is clamped at 250 pixels.</div>
<div>This div is set to auto.</div>
</div>
</body>
</html>