Description produits
section {
position: relative;
margin: 10px auto;
padding: 10px;
display: flex;
justify-content: space-between;
flex-direction: column;
div {
padding: 10px;
background: #eee;
strong {
display: block;
}
}
nav {
display: flex;
flex-direction: row;
a {
padding: 10px;
background: #fff;
color: grey;
text-decoration: none;
text-align: center;
opacity: .5;
background: #eee;
}
.actif {
opacity: 1;
color: black;
}
}
}
@media screen and (min-width: 768px) {
section {
width: 600px;
flex-direction: row;
}
section nav {
flex-direction: column;
}
}
Document
Accordéon
Caca
Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde minima veniam, voluptquis aspernatur accusamus ipsam dicta quasi sit velit iure exercitationem!
Coucou
Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde minima veniam, voluptatibus modi debitis dmus ipsam dicta quasi sit velit iure exercitationem!
coco
Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde minima veniam, voluptatibus modi debitis ducimus, corporis nesciunt numquam ipsa aut quis aspernatur accusamus ipsam dicta quasi sit velit iure exercitationem!