Bonjour à tous.

j'apprend lentement le css et j'ai trouvé un code  en CSS permettant de garder des blocs qui suivent la fenêtre pendant le scrolling

le code:

#nav 
{
display: -moz-flex;
display: -webkit-flex;
display: -ms-flex;
display: flex;
-moz-flex-direction: column;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-moz-justify-content: space-between;
-webkit-justify-content: space-between;
-ms-justify-content: space-between;
justify-content: space-between;
background: #4acaa8;
color: #d1f1e9;
height: 100%;
overflow-y: auto;
position: fixed;
text-align: center;
top: 0;
width: 23em;
right: 0;
}

quelqu'un pourrait m'expliquer les 12 premières lignes? j'ai cherché dans plusieurs sites sans résultats :/

merci d'avance et bonne soirée

Hello,

Les 12 premières lignes résument en fait 3 lignes de code :
- display : flex
- felx-direction: column
- justify-content: space-between

Chacune de ces lignes est déclinée de 4 façon, une "simple" et 3 avec des préfixes. Celles qui ont les préfixes sont en fait identiques à la "simple" mais elles s'adaptent à certains navigateurs. Par exemple display: -moz-flex; est plus adaptée pour Mozilla.

Cependant elles ne sont pas obligatoires, tu pourrait très bien te contenter des 3 lignes "simples" que j'ai cité au début

J'espère avoir été clair et ne pas avoir dit de bétises

[EDIT] comme dit plus bas, ce que je ne savais donc pas, les préfix étaient utilisés pour les anciens navigateurs, ils ne sont désormai plus utile

-
Edité par Thibaud1869 20 septembre 2017 à 17:23:10

Bonjour,

les lignes 3 à 6 sont grosso modo les mêmes : la plus importante est "display: flex", les autres sont des versions préfixées pour les anciens navigateurs (notons que -ms-flex n'a jamais existé, c'était -ms-flexbox…). Je te laisse chercher ce qu'est flex, tu trouveras les infos partout, mais en quelques mots : c'est une manière de placer les éléments de façon automatique.

Les lignes 7 à 10, même topo : c'est "flex-direction: column". Ça détermine la direction des éléments enfants du bloc, ici en colonne.

Et les lignes 11 à 14 déterminent l'alignement desdits enfants.

Un peu de lecture : https://developer.mozilla.org/fr/docs/Web/CSS/Disposition_des_bo%C3%AEtes_flexibles_CSS

Et bien ton code date, en fait les préfixes :

-
Edité par exen 20 septembre 2017 à 17:29:38

Super

merci a tous pour vos aides et lectures du soir

je me disait bien que c'était bizarre de pas trouver les préfixes sur google x)

bonne soirée a tous