One justify-start, one stretched div with grid

See more:

CSS

grid

Hi,

Using CSS Grid, I want to be able to have two divs next to each other, where the first has its width perfectly fitted, as seen with justify-self: start, and the one to the right should have its width filling the remaining space of the parent div.

The parent div has

grid-template-areas: 'content remainder'

|content|----- remainder -----|

How can I achieve this without explicitly specifying widths? The problem I'm seeing is that the parent div, by default assigns 50% of its width to content and remainder, so when content is justified to the start, the remainder doesn't stretch left to fill the remaining gap. If I set the parent div to justify-content: start, the remainder moves left, but doesn't stretch right to fill that gap either.

What I have tried:

--------------------------------------------------------------------------------