Bonjour,

Sur ma page d'accueil inspirée à la base de ce Template free https://www.w3schools.com/bootstrap/...theme_band.asp,
j'ai modifié les blocks de la page accueil pour qu'ils soient chacun de hauteur 100% mais je souhaite aussi que le contenu soit également centré "verticalement",

Pour cela, j'utilise donc une seconde div et 2 classes css suivantes :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
.container-index {
    padding: 7px;
    padding-bottom: 44px;
    width: 100%;
    min-height: 100%; /* Hauteur des rubriques de la page accueil */
    overflow-x: hidden;
 
    /* Compatibilité recherchée (div centre) : Chrome/Safari/IE/FF/Opéra */    
	height: 100%\0/IE; /* IE... seulement */
 
 
        display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.container-index-center {
	max-width: 1500px; /* largeur maxi par défaut */
	width: 100%;
 
    /* Compatibilité recherchée (div centre) : Chrome/Safari/IE/FF/Opéra */
    height: auto;
 
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
Tout fonctionne mais sous IE, lorsque le contenu d'un block est supérieur à la hauteur de la résolution écran il passe automatiquement comme en mode overflow,
ce qui donne plusieurs overflow pour chaque bloque dans la page.

le problème ne vient pas de l'activation ou désactivation de ce overflow-y, mais du fait que dans la classe "container-index" réside le paramètre height: 100%,

si vous avez une solution pour centrer ces bloques, je vous en remercie d'avance infiniment.