Sujet Précédent Sujet Suivant

Page html avec flex

Fermé
AS07 Messages postés 8 Date d'inscription dimanche 2 août 2015 Statut Membre Dernière intervention 21 octobre 2019 - 21 oct. 2019 à 10:25
bonjour je reviens vers le html et le css doucement et j avais envie de vous faire partager une modeste page effectuée avec flexbox si vous pouvez me dire ce que vous en pensez en occultant bien sur les liens d images que je n ai pas encore tagués merci d avance !!
<!DOCTYPE html>
<html lang= "fr">
<head>
	  <meta charset="utf-8" />
	  <link rel="stylesheet" href="style3.css"/>
	  <title>"utilisation de flexbox"</title>
</head>
 <body>
  <header><img class="logo" src(...) alt="logodeflexbox">
  	<h1>FLEXBOX ET SES ELEMENTS</h1>
  	<ul>
  		<li>placement vertical</li>
  		<li>placement horizontal</li>
  		<li>placement random</li>
  	</ul>
  </header>
  
  <section><h2>jouez avec les elements</h2>
  	  <div id="conteneur">
  	  	  <div class="element">element1</div>
  	  	  <div class="element">element2</div>
  	  	  <div class="element">element3</div>
  	  </div>
  </section>
  <footer>lien messagerie youtube etc
  </footer>
</body>
</html>


et la pâge CSS3 
#conteneur
{
	display:flex;
	height:480px;
	align-items:center;
	justify-content:center;
	border:solid black;
}

.element:nth-child(1)
{
background-color:blue;
}
.element:nth-child(2)
{
background-color:yellow;
}
.element:nth-child(3)
{
background-color:indigo;
}
.element
{
margin:auto;
}
.element
{
padding:auto;
margin:auto;
height: 350px;
width:250px;
}