28172 sujets

CSS et mise en forme, CSS3

Hello à toutes et tous.

Actuellement je replonge dans les CSS et me remets à jour avec le Grid layout que je découvre après plusieurs années de déploiement.
Donc je l'adopte, et il serait fou de faire autrement Smiley cligne

j'ai du mal avec minmax()
Car si je fais :
grid-template-colums: 1fr minmax(2fr, 880px) 1fr

ça couine grave... ça ne marche pas? pourquoi ?
L'idée est d'avoir donc la colonne du milieu qui soit à une largeur max de 880px et qui ne peut se reduire à - de 2 pour 1.
Pouvez vous m'éclairer sur ce sujet ?

Merci à vous.
FHB
Bon... C'est après avoir posté que l'idée m'est venue de chercher les propriétés de minmax() et trouver 'auto' qui répond parfaitement à ma problématique.
Résolu donc...
Bien à vous

FHB
Modérateur
Salut,

Alors si tu regardes la spec de minmax() tu peux voir :
minmax( [ <length> | <percentage> | min-content | max-content | auto ] , [ <length> | <percentage> | <flex> | min-content | max-content | auto ] )

https://developer.mozilla.org/fr/docs/Web/CSS/minmax

Le premier argument ne peut pas avoir de valeur en fr, seulement le second argument.
Et c'est même marqué en toute lettre :

Si max < min, max est ignoré et minmax(min,max) correspond à min. Utilisé comme maximum, une valeur <flex> permet de définir le facteur de flexibilité d'une piste de la grille, elle est invalide comme minimum.


Du coup t'as fait un
minmax(auto, 880px);
? le auto répond à ta demande de réduire à 2 pour 1 ?

Bonne soirée Smiley smile
Modifié par _laurent (07 Apr 2020 - 00:31)
Meilleure solution