La hauteur de la div n'est pas de 100% dans next.js

Question

J'ai un problème pour styliser les pages dans next.js. Je veux avoir des pages de pleine hauteur.

Par conséquent, j'ai défini l'attribut height dans les balises body et html, c'est OK et j'ai la pleine hauteur pour les balises body et html (prouvé dans les outils de développement) mais bien que j'ai défini #__next height à 100%, je n'ai pas pu obtenir la pleine hauteur pour elle. Si j'applique d'autres mesures telles que px ou vh, cela n'a pas d'incidence.

layout.css

html {
  height: 100%;
  font-size: 16px;
}
body {
  min-height: 100%;
  font-family: @text-font-family;
  direction: rtl !important;
  text-align: start !important;
}
#__next {
height: 100%; // or min-height
}

Answer 1

position: absolute; pourrait vous convenir

html,
body {
  margin: 0;
}

#__next {
  background: blue;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

<div id="__next"></div>