1
<!doctype html>
2
<title>Example</title>
3
<style>
4
.grid {
5
  display: grid;
6
  grid-template-columns: repeat(5, 1fr);
7
  grid-gap: 10px;
8
  align-items: start;
9
  justify-items: center;
10
  }
11
.grid img {
12
  border: 1px solid rgba(0,0,0,0.3);
13
  box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.3);
14
  max-width: 100%;
15
}
16
.grid img:nth-child(6) {
17
  grid-column: span 5;
18
  }
19
</style>
20
<main class="grid">
21
  <img src="/pix/samples/22m.jpg" alt="Sample photo">
22
  <img src="/pix/samples/23m.jpg" alt="Sample photo">
23
  <img src="/pix/samples/24m.jpg" alt="Sample photo">
24
  <img src="/pix/samples/25m.jpg" alt="Sample photo">
25
  <img src="/pix/samples/15m.jpg" alt="Sample photo">
26
  <img src="/pix/samples/17l.jpg" alt="Sample photo">
27
  <img src="/pix/samples/27m.jpg" alt="Sample photo">
28
  <img src="/pix/samples/28m.jpg" alt="Sample photo">
29
  <img src="/pix/samples/26m.jpg" alt="Sample photo">
30
  <img src="/pix/samples/30m.jpg" alt="Sample photo">
31
  <img src="/pix/samples/31m.jpg" alt="Sample photo">
32
</main>