[Résolu] Grid et valeur auto

Bonjour,

J'aurai besoin d'un conseil concernant la mise en page grid pour comprendre. Conteneur de type basique, j'ai 3 lignes et 3 colonnes dont voici le css :

.container-body-none{
   display: grid;
    height: 100vh;
    grid-template-columns: 15% 1fr 15%;
    grid-template-rows: auto 1fr 0.2fr;
    grid-template-areas: 
    "head head head"
    "left content right"
    "foot foot foot";
}

Mon incompréhension se trouve à la ligne :

grid-template-rows: auto 1fr 0.2fr; 

En effet, si je remplace "0.2fr" par "auto", cela me provoque un leger espace dans le footer et fait apparaitre l'ascenseur. Y a t-il une explication à ce soucis ?

Par avance merci
JLuc

Edit : si je rajoute un padding, meme de 2px, le soucis disparait.
Modifié par gesualda (19 May 2024 - 09:12)

Bonjour,

Ça dépend du html et du reste du css.

Amicalement,

Bonjour parsimonh.

L'erreur était toute simple, j'ai re-controlé le code et j'avais :

body{line-height: 1.1;}

Donc voila ce qui provoquait ce soucis.
Bonne journée