Equal width columns in CSS Grid

Question

I\'d like to have the html below showing in n equal columns whether there are two, or three, or more child elements to the row element using css grid - Flexbox makes this ea

Answer 1

None of these answers worked for me, So I tried another way. In my case, item size is related to the content. Some contents are bigger than others, so all columns will not be equal. I just wrapped any item with another division that has 100% width and 100% height and that is working.

<div class="row">
    <div style="width: 100%; height: 100%;">
      <div class="item"></div>
    </div>
    <div style="width: 100%; height: 100%;">
      <div class="item"></div>
    </div>
    <div style="width: 100%; height: 100%;">
      <div class="item"></div>
    </div>
</div>

That is worked for me and I hope to help you.