title: Make CSS grid element a hyperlink
body: <p>I am really not sure on how to make a grid element a hyperlink anno 2019 standard. I need the grid element <code>&lt;div class="item1"&gt;</code> to be a hyperlink.</p>
  
  <p>How am I doing that the best way?</p>
  
  <p><strong>Code Example</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.item1 {
    grid-row: 1 / 3;
    grid-column: 1/7;
    height: 700px;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    background-image: url("/Cms/ea8d405c-d794-4616-9b16-c921a76c43a2.jpg");
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="wrapper"&gt;
    &lt;div class="item1"&gt;
      &lt;span&gt;TAG&lt;/span&gt;
      &lt;span class="sbp-title light-font" href="#"&gt;Read More&lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>