There are many css grid solutions, I would recommend looking at bootstrap, bulma, materialize for examples.
Essentially most of them are comprised of a grid broken down into 12 columns. For your example in bulma the following would render the same:
<div class="columns is-multiline">
<div class="column is-two-thirds">bigger</div>
<div class="column is-one-third">smaller</div>
</div>
The way it works in the CSS is @media queries which specify how to handle the object widths at various screen widths.
In your example, your min-width is the only thing creating the scaffolding effect. When you fill in your elements with content you may notice them behave unexpectedly.
Also, this may have been more of a stackoverflow question.