title: Hiding an element with CSS Grid
body: <p>Using <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout" rel="nofollow noreferrer">CSS Grid layout</a> how can I safely hide a row without <code>grid-template-rows</code> layout properties getting passed over to the next row? I tried <code>display: none;</code> but the layout of the hidden element is passed over to the next element. </p>
  
  <p>Here's a code example: <a href="http://plnkr.co/edit/E3kuJcDxKnrjjbdVHQbO?p=preview" rel="nofollow noreferrer">http://plnkr.co/edit/E3kuJcDxKnrjjbdVHQbO?p=preview</a>. What I'm trying to do is toggle the visibility of the <code>.item2</code> element without effecting any other elements on the page. Thanks!</p>