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 { .gallery {
display: flex; display: flex;
flex-wrap: wrap; 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 > * { .gallery .card {
margin: 3px 6px 3px 0px; display: flex;
flex-direction: column;
flex-wrap: wrap;
flex: 1; 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 { .gallery::after {
content: ""; content: "";
@@ -64,10 +69,6 @@
width: 240px; width: 240px;
max-width: 98vw; max-width: 98vw;
} }
#tous_numeros img {
max-height: 200px;
border: 1px solid lightgrey;
}
</style> </style>
</head> </head>
<body> <body>
@@ -92,31 +93,98 @@
<img id="dernier_numero" src="./docs/revues/litt23.jpg" alt="revue litterall"> <img id="dernier_numero" src="./docs/revues/litt23.jpg" alt="revue litterall">
</div> </div>
<div class="gallery" id="tous_numeros"> <div class="gallery" id="tous_numeros">
<img src="./docs/revues/litt22.jpg" alt="revue litterall"> <div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall"> <img src="./docs/revues/litt22.jpg" alt="revue litterall">
<img src="./docs/revues/litt20.jpg" alt="revue litterall"> <p>tesxt dedz alijd alid eelifjlizijd zadzdlijea adedn deoa</p>
<img src="./docs/revues/litt20.jpg" alt="revue litterall"> </div>
<img src="./docs/revues/litt19.jpg" alt="revue litterall"> <div class="card">
<img src="./docs/revues/litt17.jpg" alt="revue litterall"> <img src="./docs/revues/litt21.jpg" alt="revue litterall">
<img src="./docs/revues/litt19.jpg" alt="revue litterall"> <p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
<!-- </div>
<img src="./docs/revues/lion.jpg" alt="lion"> <div class="card">
--> <img src="./docs/revues/litt20.jpg" alt="revue litterall">
<img src="./docs/revues/litt21.jpg" alt="revue litterall"> <p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
<img src="./docs/revues/litt22.jpg" alt="revue litterall"> </div>
<img src="./docs/revues/litt21.jpg" alt="revue litterall"> <div class="card">
<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"> <p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
<img src="./docs/revues/litt17.jpg" alt="revue litterall"> </div>
<img src="./docs/revues/litt19.jpg" alt="revue litterall"> <div class="card">
<img src="./docs/revues/litt21.jpg" alt="revue litterall"> <img src="./docs/revues/litt19.jpg" alt="revue litterall">
<img src="./docs/revues/litt22.jpg" alt="revue litterall"> <p>fefijl fe sdj dazdjljlf sf fvd;ijsg; feikeqzd f;femsokmkqzd dkqlklmokqz</p>
<img src="./docs/revues/litt21.jpg" alt="revue litterall"> </div>
<img src="./docs/revues/litt20.jpg" alt="revue litterall"> <div class="card">
<img src="./docs/revues/litt19.jpg" alt="revue litterall"> <img src="./docs/revues/litt17.jpg" alt="revue litterall">
<img src="./docs/revues/litt17.jpg" alt="revue litterall"> <p>fk gr sd erzg qre qgrse qf shttr qsr hg ef fr hrq</p>
<img src="./docs/revues/litt19.jpg" alt="revue litterall"> </div>
<img id="last-child-img" src="./docs/revues/litt21.jpg" alt="revue litterall"> <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> </div>
</article> </article>
</main> </main>