pro/2022_WEBSITE_kosmopolit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

album fonctionne avec texte

Browse Source
This commit is contained in:
hugogogo
2021-02-15 21:45:20 +01:00
parent 72bab0c2d5
commit 5806a7913d
1 changed files with 109 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

150
pages/litterall.html
View File

@@ -36,20 +36,25 @@
.gallery {
display: flex;
flex-wrap: wrap;
/*
justify-content: flex-start;
width: 90%;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(120px, max-content));
grid-gap: 2px;
justify-content: center;
padding: initial;
*/
}
.gallery > * {
margin: 3px 6px 3px 0px;
.gallery .card {
display: flex;
flex-direction: column;
flex-wrap: wrap;
flex: 1;
justify-content: space-between;
margin: 3px 6px 3px 0px;
border: 1px solid lightgrey;
}
.gallery .card > * {
margin: 5px;
}
.gallery .card img {
max-height: 200px;
border: 1px solid lightgrey;
}
.gallery .card p {
display: none;
}
.gallery::after {
content: "";
@@ -64,10 +69,6 @@
width: 240px;
max-width: 98vw;
}
#tous_numeros img {
max-height: 200px;
border: 1px solid lightgrey;
}
</style>
</head>
<body>
@@ -92,31 +93,98 @@
<img id="dernier_numero" src="./docs/revues/litt23.jpg" alt="revue litterall">
</div>
<div class="gallery" id="tous_numeros">
<img src="./docs/revues/litt22.jpg" alt="revue litterall">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<img src="./docs/revues/litt17.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<!--
<img src="./docs/revues/lion.jpg" alt="lion">
-->
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<img src="./docs/revues/litt22.jpg" alt="revue litterall">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<img src="./docs/revues/litt17.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<img src="./docs/revues/litt22.jpg" alt="revue litterall">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<img src="./docs/revues/litt17.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<img id="last-child-img" src="./docs/revues/litt21.jpg" alt="revue litterall">
<div class="card">
<img src="./docs/revues/litt22.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
</div>
<div class="card">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
</div>
<div class="card">
<img src="./docs/revues/litt17.jpg" alt="revue litterall">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/lion.jpg" alt="lion">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt22.jpg" alt="revue litterall">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
</div>
<div class="card">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt17.jpg" alt="revue litterall">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
</div>
<div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
</div>
<div class="card">
<img src="./docs/revues/litt22.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt20.jpg" alt="revue litterall">
<p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
</div>
<div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img src="./docs/revues/litt17.jpg" alt="revue litterall">
<p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
</div>
<div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
<div class="card">
<img id="last-child-img" src="./docs/revues/litt21.jpg" alt="revue litterall">
<p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
</div>
</div>
</article>
</main>