IUT_Informatique/KyFlo
Archived
1
0
Fork 0
Code Activity

added flex container index

Browse source
This commit is contained in:
KEZEL BENOIT p1907091 2019-12-12 11:10:56 +01:00
parent 727101274f
commit 3e4c95bdff
2 changed files with 39 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
Assets/css.css
View file

@ -168,3 +168,31 @@ div#slider figure {
/*============================================*/ /*============================================*/
.flex-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
background-color: rgb(187, 187, 187);
}
.flex-container>div {
box-shadow: 0.3vw 0.3vw 2px grey;
width: 20%;
margin: 1vw;
text-align: center;
font-size: 30px;
}
.flex-container>div>img{
width: 85%;
}
.flex-container>div>p{
font-size: 0px;
}
.flex-container>div:hover p{
font-size: 40px;
transition-duration: 0.2s;
}

19
index.html
View file

@ -32,14 +32,17 @@
<a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Promotions/promo1.png" alt></a> <a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Promotions/promo1.png" alt></a>
</figure> </figure>
</div> </div>
<div class="flex-container"> <div class="content">
<div>Robot Nao</div> <div class="flex-container">
<div>Robot Valkyrie</div> <div><img src="Assets/Images/Produits/nao.png" alt><p>Nao</p></div>
<div>Robot Terminator</div> <div><img src="Assets/Images/Produits/valkyrie.png" alt><p>Valkyrie</p></div>
<div>Robot x</div> <div><img src="Assets/Images/Produits/soldat.png" alt><p>Soldat</p></div>
<div>Robot y</div> <div><img src="Assets/Images/Produits/r2d2.png" alt><p>R2D2</p></div>
</div> <div><img src="Assets/Images/Produits/pepper.png" alt><p>Pepper</p></div>
<div><img src="Assets/Images/Produits/terminator.png" alt><p>Terminator</p></div>
</div>
</div>
</body> </body>