Collapsible div inside a CSS grid container expands full width
问题 I have a group of expandable divs inside a CSS grid container. I am using Polymer framework and its iron-collapse component. Codepen - https://codepen.io/vijayvmenon/pen/ZEYKZMX CSS: .card { display: grid; grid-template-columns: repeat(auto-fill,minmax(400px,1fr)); grid-column-gap: 30px; } .container { display:flex; flex-direction:column; border:1px solid black; } The CSS should be pretty straightforward. When I click on any div, the other divs in the row also expand. How can I fix this by