-1
votes

Espace vide pour une largeur de colonnes avec flexbox

J'ai un parent div et deux divs à l'intérieur. Je veux garder des tailles spécifiques (colonnes) pour ces enfants d'enfants. Est-ce possible dans Flexbox? Je me lève avec ceci.

<div class="parent"> 
   <div class="child"></div>
   <div class="child"></div>
</div>

html css flexbox

5 commentaires

25% et 50% de largeur, non?

@Tmaniafif plus de moins oui, mais serait bien d'avoir un espace automatique entre si possible

Veuillez inclure votre CSS aussi, pour démontrer où vous êtes coincé.

Ensuite, vous avez besoin de la grille CSS non flexbox

@Tmaniafif merci. Je pense que je vais le faire avec la grille.

3 Réponses :

1
votes

Vous pouvez obtenir cette utilisation en utilisant Flexbox en utilisant un élément pseudo em> qui occupe la quatrième colonne:

Ajouter flex: 1 code> au premier enfant code> et le pseudo élément em>, p> li>
Ajouter flex: 2 code> au second enfant code>. p> li> ul> voir la démonstration ci-dessous: p> p> <div class="parent"> <div class="child"></div> <div class="child"></div> </div>

0 commentaires

1
votes

Voici une méthode utilisant Flex-Base Pour définir des éléments Flex sur des largeurs de pourcentage spécifiques.

Dans cet exemple, les deux éléments flexibles ne peuvent ni rétrécissez ni grandir . Dépendre à 100% de largeur dans quatre colonnes, chaque colonne doit être de 25% de la largeur des parents. Le premier élément est de 25% et la seconde est de 50% (deux colonnes de large), laissant 25% d'espace à droite. P>

<div class="parent">
  <div class="child"></div>
  <div class="child"></div>
</div>

0 commentaires

1
votes

Personne ne semble avoir suggéré que vous puissiez définir la largeur du parent:

<div class="parent"> 
   <div class="child"></div>
   <div class="child"></div>
</div>

0 commentaires