Even width ion-cols in variable browser width

What is the way to handle a grid in a browser (could be any width) which will adjust the size of the ion-cols evenly while having a minimum width.

I can do this with css but I thought there would be a way by only using the grid col size features in Ionic4.

Here is the result without using css (except for the minimum width I have applied 250px).

The second row in yellow has two items at 50% filling the width of the row. I would like them to be the same size as the top row’s items.

The second row in green has one item the full width of the row. I would it to also be the same size as the top row’s items.

Here is the result with css and what I want to achieve without using css.
grid4 grid5