28172 sujets

CSS et mise en forme, CSS3

Bonjour.
J'ai une page web sur la quelle j'aimerai désaxer un élément flex.
Voici le code :

<html>
<head>
  <title> Test flex</title>
  <link rel="stylesheet" type="text/css" href="style.css">
  <meta charset="utf-8">
  </head>
  <body>

    <div id="conteneur">
      <div class="element">Element 1 </div>
      <div class="element">Element 2 </div>
      <div class="element">Element 3 </div>
      </div>
    </body>
    </html>



#conteneur
{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.element{
  border : 3px solid red;
  background-color: red;
}
.element:nth-child(2)
{
background-color: blue;
 align-self: flex-end;
}


Merci.
llaq.
Administrateur
Bonjour,

Pourrais-tu préciser ta question ? Que souhaites-tu exactement ?

Ton deuxième élément est *déjà* désaxé avec le code que tu présentes. Il suffit de donner une hauteur au parent pour s'en rendre compte par exemple.