1
<!doctype html>
2
<title>Example</title>
3
<style>
4
#grid {
5
  display: grid;
6
  grid-template-columns: 1fr 1fr 1fr;
7
  grid-gap: 1px;
8
}
9
#grid > div {
10
  background-color: orangered;
11
  color: white;
12
  font-size: 4vw;
13
  padding: 10px;
14
}
15
#grid > div:nth-child(5) {
16
  grid-column-end: 4;
17
  background: limegreen;
18
  animation: myAnimation 1s ease 1s 5 alternate forwards;
19
  }
20
@keyframes myAnimation {
21
  100% {
22
  grid-column-end: span 2;
23
  }
24
</style>
25
<div id="grid">
26
  <div>1</div>
27
  <div>2</div>
28
  <div>3</div>
29
  <div>4</div>
30
  <div>5</div>
31
  <div>6</div>
32
  <div>7</div>
33
  <div>8</div>
34
  <div>9</div>
35
</div>