diff options
| author | Kévin Le Gouguec <kevin.legouguec@gmail.com> | 2020-10-21 23:16:35 +0200 |
|---|---|---|
| committer | Kévin Le Gouguec <kevin.legouguec@gmail.com> | 2020-10-21 23:19:11 +0200 |
| commit | 2f291a86ae64a501033f6fb1141aa8f81b7af955 (patch) | |
| tree | 87a36843a47264ebf132b4e2a00c17392729ff84 | |
| parent | faecfa554e8ac349706b97e5a438052832157c51 (diff) | |
| download | quatuorbellefeuille.com-2f291a86ae64a501033f6fb1141aa8f81b7af955.tar.xz | |
add event images
| -rw-r--r-- | événements.css | 15 | ||||
| -rw-r--r-- | événements.html | 50 |
2 files changed, 54 insertions, 11 deletions
diff --git a/événements.css b/événements.css index e76a531..5ee11c5 100644 --- a/événements.css +++ b/événements.css @@ -10,8 +10,21 @@ } .event { + position: relative; + background-color: #fff; display: flex; align-items: center; justify-content: center; - background-color: #fff; +} + +.event img { + position: absolute; + object-position: center; + object-fit: cover; + height: 100%; + width: 100%; +} + +.event p { + z-index: 1; } diff --git a/événements.html b/événements.html index 97fba31..23cbabe 100644 --- a/événements.html +++ b/événements.html @@ -14,16 +14,46 @@ <div class="main"> <div class="events"> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> - <div class="event"><p>Quelque part<br>À un moment</p></div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/0/05/KolimaOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/8/84/Bilibin.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/7/70/VaultOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/6/65/ValeOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/e/ef/TolbiOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/0/05/KolimaOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/8/84/Bilibin.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/7/70/VaultOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/6/65/ValeOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> + <div class="event"> + <img src="https://static.wikia.nocookie.net/goldensun/images/e/ef/TolbiOverworld.png"> + <p>Quelque part<br>À un moment</p> + </div> </div> </div> </body> |