Bonjour à tous,

J'ai un code html qui contient

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
<html>
<head></head>
<nav</nav>
<div id="CorpPage">
  <section id="MenuGauche"></section>
   <section id="Articles"></section>
   <section id="MenuDroit"></section>
</div>
</html>

Qui donne :

Nom : flexbox-dev.png Affichages : 312 Taille : 5,0 Ko

Pour obtenir les deux menu "A gauche" qui se superposent, je force l'ordre via CSS.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
div {
display: flex; 
flex-wrap: wrap; 
}
 
 
#MenuDroit {
order: 1 
}
 
#MenuGauche {
order: 2; 
width: 18%
}
 
#Contenu }
order: 3
width: 79%; 
}
Ce qui donne :

Nom : flexbox-dev-2.png Affichages : 255 Taille : 5,0 Ko

Le soucis, c'est que je voudrais coller les deux colonnes de gauche comme ceci :

Nom : flexbox-dev-3.png Affichages : 248 Taille : 5,0 Ko


Quel est la meilleure façon pour repositionner ce block "correctement" et sans ternir compte de la hauteur que le bloc de contenu peut prendre ?

Merci d'avance