Accueil > ... > Forum 377

Squelette généraliste ViaSPIP 3.1 gratuit

29 octobre, 16:57, par Christophe ANTOINE

Voici donc le souci de « responsive ». La largeur est fixée par défaut à une valeur importante. Pas de souci, j’aime aussi quand c’est large quand on a un écran de grande définition. Mais quand on réduit la largeur à une taille intermédiaire (vers 1020 pixels), les blocs ne s’ajustent plus et un ascenseur horizontal apparaît, et ne disparaît que quand on arrive vers des tailles de 640px et moins.

Voici donc la correction que je propose pour theme.css.
Au lieu d’avoir, dans les blocs principaux :

.page width : 90% !important ; width : 1003px ; max-width : 1325px ; min-width : 1003px ; margin : 0 auto 10px auto ; padding : 38px 10px 0px 10px ;
background : #FFF2C2 ; overflow : hidden ;

se contenter de la même chose sans les paramètres liés à la largeur :

.page width : 90% !important ; margin : 0 auto 10px auto ; padding : 38px 10px 0px 10px ; background : #FFF2C2 ; overflow : hidden ;

et plus loin, définir des précisions dédiées aux grands écrans :

/* --------------------------------------------
/* Affichage sur grands ecrans
/* -------------------------------------------- */
@media (min-width : 1024px)
/* Bloc principal de page */
.page width : 1003px ; max-width : 1325px ; min-width : 1003px ;

Ainsi, plus d’ascenseur, et le but initial, c’est à dire un affichage large pour les grands écrans, est atteint.
A+
Christophe

Un message, un commentaire ?

modération a priori

Ce forum est modéré a priori : votre contribution n’apparaîtra qu’après avoir été validée par un administrateur du site.

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.