« MediaWiki:Common.css » : différence entre les versions
(Contenu remplacé par « →Conteneur en 2 colonnes : .row-2cols { display: flex; flex-wrap: wrap; →Permet le passage à la ligne : gap: 2%; →Espacement entre colonnes : } →Chaque colonne occupe environ la moitié : .row-2cols .col { flex: 1 1 48%; } →Sur mobile : les colonnes s’empilent : @media (max-width: 768px) { .row-2cols { flex-direction: column; } .row-2cols .col { flex: 1 1 100%; max-width: 100%; } } ») Balise : Contenu remplacé |
Aucun résumé des modifications |
||
| Ligne 11 : | Ligne 11 : | ||
} | } | ||
/* Sur mobile : les colonnes | /* Sur mobile : forcer les colonnes à s’empiler */ | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.row-2cols { | .row-2cols { | ||
flex-direction: column; | flex-direction: column !important; | ||
} | } | ||
.row-2cols .col { | .row-2cols .col { | ||
flex: 1 1 100%; | flex: 1 1 100% !important; | ||
max-width: 100%; | max-width: 100% !important; | ||
width: 100% !important; | |||
float: none !important; /* supprime les flottants */ | |||
display: block !important; | |||
} | } | ||
} | } | ||
Version du 25 septembre 2025 à 13:56
/* Conteneur en 2 colonnes */
.row-2cols {
display: flex;
flex-wrap: wrap; /* Permet le passage à la ligne */
gap: 2%; /* Espacement entre colonnes */
}
/* Chaque colonne occupe environ la moitié */
.row-2cols .col {
flex: 1 1 48%;
}
/* Sur mobile : forcer les colonnes à s’empiler */
@media (max-width: 768px) {
.row-2cols {
flex-direction: column !important;
}
.row-2cols .col {
flex: 1 1 100% !important;
max-width: 100% !important;
width: 100% !important;
float: none !important; /* supprime les flottants */
display: block !important;
}
}