Mise en page avec flexbox
Résolu
christian82000
Messages postés
47
Date d'inscription
Statut
Membre
Dernière intervention
-
christian82000 Messages postés 47 Date d'inscription Statut Membre Dernière intervention -
christian82000 Messages postés 47 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
j'ai une page d'accueil organisée comme le montre le dessin ci-joint, actuellement codée avec float:

Je voudrais faire disparaître l'espace qui apparaît entre div, variable selon la hauteur de la div voisine.
J'ai essayé en utilisant flexbox:
Mais le problème n'est pas résolu.
Quelqu'un a-t-il une idée?
Merci d'avance.
Christian
j'ai une page d'accueil organisée comme le montre le dessin ci-joint, actuellement codée avec float:

Je voudrais faire disparaître l'espace qui apparaît entre div, variable selon la hauteur de la div voisine.
J'ai essayé en utilisant flexbox:
<head> .conteneur { display:inline-flex; /*permet de se ranger à droite de edito*/ flex-direction:column; /*on prend pour axe principal l'axe vertical*/ flex-wrap:wrap; /*retour à la ligne si contenant trop petit*/ align-items:flex-start; /*on aligne sur la ligne de départ*/ width:55%; /*dimensions et caractéristiques du contener*/ height:auto; margin:0px; } .edito { width:40%; height: auto; background-color:#5EB6DD; border: 1px solid red; padding:0px 10px 10px 10px; margin: 0px; } .element { width:40%; height: auto; background-color:#5EB6DD; border: 1px solid red; padding:0px 10px 10px 10px; margin: 0px; } </head> <body> <header></headert> <nav></nav> <div class="edito"></div> <div class="conteneur"> <div class="élément"></div> <div class="élément"></div> <div class="élément"></div> <div class="élément"></div> <div class="élément"></div> </div>
Mais le problème n'est pas résolu.
Quelqu'un a-t-il une idée?
Merci d'avance.
Christian
A voir également:
- Mise en page avec flexbox
- Mise en forme conditionnelle excel - Guide
- Supprimer page word - Guide
- Mise a jour chrome - Accueil - Applications & Logiciels
- Mise a jour windows 10 - Accueil - Mise à jour
- Mettre google en page d'accueil - Guide