creating photo gallery using css

I'm trying to take the following code:

<!doctype html>
<title>Example</title>
<style>
.grid { 
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-gap: 20px;
  align-items: stretch;
  }
.grid img {
  border: 1px solid #ccc;
  box-shadow: 2px 2px 6px 0px  rgba(0,0,0,0.3);
  max-width: 100%;
}
</style>

<main class="grid">
  <img src="http://i.imgur.com/tI5jq2c.jpg">
  <img src="http://i.imgur.com/37w80TG.jpg">
  <img src="http://i.imgur.com/B1MCOtx.jpg">
</main>

and break it down two 2 files, html and css

Here is the HTML file:

<!doctype html>
<title>Example</title>
<head>
    <link rel="stylesheet' href="gallery-example.css">
</head>

<img src="http://i.imgur.com/tI5jq2c.jpg">
<img src="http://i.imgur.com/37w80TG.jpg">
<img src="http://i.imgur.com/B1MCOtx.jpg">

And here is the gallery-example CSS file:

 img {
    float: left;
    width:  100px;
    height: 100px;
    object-fit: cover;
    }
    
  .grid { 
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-gap: 20px;
    align-items: stretch;
    }
  .grid img {
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px  rgba(0,0,0,0.3);
    max-width: 100%;
  }

Can you please let me know why I am not getting the same gallery image? I'm just started learning html/css. thank you!!

Solution

You have a typo in your code. Use <link rel="stylesheet" instead of <link rel="stylesheet' (notice the mismatch of single quotes and double quotes).