Module CSS pour des dispositions flexibles offrant une large gamme d'options pour aligner les éléments tout en éliminant le besoin de flotteurs et de tableaux.

flexbox...

J'ai un bootstrap de base 4, une page flexible dont la navigation et le pied de page devraient être collants mais ce n'est pas le cas et je ne peux pas comprendre pourquoi: <!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport....
9 janv. 2020 à 19:43
Chaque fois que je pratique les CSS mises en page, chaque fois que je redimensionne la fenêtre du navigateur, l'écran sur le côté droit du site continue d'être coupé, il y aura donc un espace vide avec un fond blanc. Quelqu'un peut-il m'aider à identifier le problème afin que je puisse éviter défini....
8 janv. 2020 à 07:18
J'ai construit une disposition de galerie. Chaque section <div class="gallery"> remplit la fenêtre. Voici à quoi cela ressemble sans en-tête collant. La mise en page fonctionne comme prévu en utilisant cette méthode. body { margin: 0; font-size: 16px; font-size: 1rem; line-height: 1.5....
5 janv. 2020 à 21:04
Je crois que mon image de fond crée un espace vide entre lui et mon pied de page collant flexbox. J'ai essayé de nombreuses façons, mais elles ne font que créer des problèmes différents jusqu'à présent ... Quelqu'un peut-il aider? J'ai créé une image d'espace réservé de la taille de mon image d'orig....
Je crée une disposition des grilles à peu près comme ceci: Mon Tue Wed Thu This is a very very very very very very very very ... 11.11% achieved J'y suis presque, mais je ne peux pas obtenir d'espacement entre les jours de la semaine (imbriqué dans les composants Typo....
27 déc. 2019 à 19:32
Comment afficher le défilement de la table Bootstrap à l'aide d'un conteneur flexible? https://getbootstrap.com/docs/4.4/content/tables/#responsive-tables J'ai besoin de DIVS de l'exemple JSFiddle. Si je supprime display: flex de .flex_container et que je redimensionne le navigateur Cela fonctionne....
26 déc. 2019 à 23:36
Il s'agit de flexbox. J'ai une boîte de 150px de largeur. À l'intérieur de cette boîte, il y a un texte et une icône. Je veux qu'ils s'alignent à gauche. Le problème est que lorsqu'un saut de ligne est nécessaire, les éléments sont distribués uniformément. li { width: 150px; box....
19 déc. 2019 à 19:03
Sur une mise en page mobile, j'ai six divisions l'une en dessous de l'autre par ordre d'importance. Sur le bureau, je voudrais réorganiser les articles. Sur l'image ci-dessous, la disposition mobile est à gauche, la disposition bureau à droite. Les hauteurs des six éléments ne sont pas liées les un....
19 déc. 2019 à 16:22
Je souhaite étirer l'image verticalement en fonction du contenu en utilisant les propriétés flex sans utiliser la hauteur. Si la taille du contenu augmente ou diminue, l'image doit être étirée automatiquement. s'il vous plaît, quelqu'un peut-il me suggérer dans la bonne direction? Merci d'avance .......
19 déc. 2019 à 09:13
Bonjour je veux faire mes 2 colonnes de la même hauteur (avec une hauteur min de 100vh) <div class="wrapper"> <div class="col">... little content... </div> <div class="col">...more content... </div> </div> Mon CSS est .wrapper { display: flex; height: 100vh; } .col { outline: 1....
19 déc. 2019 à 06:06
J'ai ce code ici et il se comporte différemment dans Safari que dans Chrome et Firefox, pourquoi? .parent { height: 150px; display: flex; flex-direction: column; background: salmon; border: 2px solid black; } .child1 { background: red; } .child2 { background: grey; ....
18 déc. 2019 à 20:36
Ayant un problème avec plusieurs images ensemble déformées lorsque j'utilise flex. A essayé align-self et align-items, mais n'a pas fonctionné. html / css: #lastf footer{ background:#090D19; padding-top: 20px; display: flex; flex-wrap: wrap; } #lastf h3{ text-align: center; width:....
18 déc. 2019 à 07:47
J'ai du code HTML que je ne peux pas modifier et qui est similaire à celui ci-dessous. Je dois utiliser Flexbox pour réorganiser les éléments (et forcer un «saut de ligne» avant le dernier élément). Comment puis-je faire en sorte que la plupart des éléments flexibles soient traités comme des unités ....
18 déc. 2019 à 04:13
J'essaie de tracer des lignes entre les cercles, j'ai ce code https://codepen.io/cfmorales/pen/qBEqGpr , d'une certaine manière, cela fonctionne, mais lorsque vous redimensionnez la page, la hauteur de la ligne ne correspond pas au cercle, des idées sur la façon de la rendre réactive? toute la magi....
17 déc. 2019 à 17:52
J'essaie d'apprendre à travailler avec les flexbox. J'ai fait un exemple ici: /* Grid */ .column { flex-basis: 100%; } @media screen and (min-width: 800px) { .row { display: flex; flex-direction: row; flex-wrap: nowrap; } .column { flex: 1; } } /* Style ....
17 déc. 2019 à 16:57
Sur ma page de boutique en ligne, les 8 principales catégories de produits ainsi que les produits ci-dessous sont affichés sous forme de tuiles / boîtes. Le CSS a été optimisé et fonctionne très bien dans mon navigateur Chrome installé (version 79.0.3945.79) ainsi que dans mon navigateur Safari (ver....
16 déc. 2019 à 21:47
Ma disposition actuelle est comme indiqué dans l'image ci-dessous: Un parent div contenant deux div flex-box mis à flex-direction: column;. Celui de gauche est défini sur flex-basis: initial; et celui de droite est défini sur flex: 1;. Je veux savoir si je peux modifier les éléments enfants de div ....
16 déc. 2019 à 15:12
Nous avons un élément div avec beaucoup de sous-éléments et cela ne s'affiche pas correctement dans le dernier Chrome (79) sur Mac. Nous obtenons deux barres de défilement et il semble que la liste occupe trop d'espace et force le titlePanel et l'actionPanel hors de la fenêtre d'affichage. Voir les ....
16 déc. 2019 à 13:54
Je travaille actuellement sur la réactivité de ma page web et j'ai implémenté flexbox pour le positionnement des éléments de ma page. Le problème que je rencontre est que lorsque j'utilise «flex-direction: colonne» dans ma requête multimédia, les div disparaissent lors du redimensionnement du naviga....
15 déc. 2019 à 08:20
J'essaie de faire fonctionner une mise en page sans JS, juste HTML et CSS. top-div left-div center-div right-div L'idée est d'avoir des barres de défilement verticales sur la division centrale, mais nulle part ailleurs sur la page, y compris le corps. Il semblait que la meilleure idée ser....
15 déc. 2019 à 03:56
J'ai la boîte flexible avec les enfants. Je cherche une solution pour savoir que, existe-t-il un moyen de maintenir l'espace autour de la gauche, de la droite, du haut, du bas autour des enfants? pour mon essai: gauche et droite n'est même pas - comment le résoudre? comment assurer le même espace ap....
14 déc. 2019 à 15:57
Sans javascript ni grille car c'est juste une page de destination et je veux être pris en charge dans tous les navigateurs j'essaye de créer une page de prix comme dans l'image ci-dessous: J'ai utilisé flex pour cet exemple. Le bloc de prix serait en texte intégral et je souhaite conserver une pr....
14 déc. 2019 à 14:07
J'utilise React Native en utilisant Flexbox. la propriété display: flex n'existe pas, mais elle existe par exemple flex: x J'essaie de faire quelque chose comme ça: un élément à gauche conservant la largeur qui occupe son contenu ainsi que l'élément central Comment puis-je le faire? Si dans mon cod....
14 déc. 2019 à 00:01
Je travaille actuellement sur l'affichage des détails du profil utilisateur. J'essaie d'avoir un jeu de cartes avec les informations énumérées ci-dessous. Je voudrais que ces éléments soient assis côte à côte au lieu de diviser comment ils sont dans l'image ci-dessous. J'ai essayé de donner à chaque....
13 déc. 2019 à 19:48
J'ai un menu qui déborde de son contenant. Comment faire pour que la partie débordante commence sur une nouvelle ligne et reste dans l'élément parent? Exemple Voici ma structure HTML: <div class="product-menu" style="display: flex;"> <div class="kolom"> <h2>Woonkamer</h2> <ul> ....
13 déc. 2019 à 15:40