title: How to set height to child tag
body: <p>I want to set the height of a child tag to 100% but as soon as I redirect to another page the height remains same disabling the page to scroll.</p>
  <p>Image 1.css</p>
  <pre><code>body{
    background: url(&quot;Resources/Cash.jpeg&quot;);
  }
  html,body{
    margin: 0;
    padding: 0;
  }
  #root{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
  .account{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    padding: 30px;
    backdrop-filter: blur(2px);
  }
  </code></pre>
  <p>This style without setting the <code>height</code> makes the first page look half but the second page which is 'Create' looks perfect and scrollable.</p>
  <p>Image 1</p>
  <p><a href="https://i.stack.imgur.com/jR7tM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jR7tM.png" alt="Image 2" /></a></p>
  <p>Image 2.css</p>
  <pre><code>body{
    background: url(&quot;Resources/Cash.jpeg&quot;);
  }
  html,body{
    margin: 0;
    padding: 0;
    height: 100%;
  }
  #root{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  .account{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    padding: 30px;
    height: 100%;
    backdrop-filter: blur(2px);
  }
  </code></pre>
  <p>But after adding <code>height</code> to <code>html</code>,<code>body</code>,<code>account</code> and  <code>root</code>, the home page looks perfect but the 'Create' page has 'Height' of 100% so it fits the page and becomes unable to scroll.</p>
  <p>Image 2</p>
  <p><a href="https://i.stack.imgur.com/SbIl2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SbIl2.png" alt="Image 1" /></a></p>
  <p>React Html Outer body</p>
  <pre><code>&lt;div id=&quot;root&quot;&gt;
    &lt;div class=&quot;account&quot;&gt;
      &lt;!-- Content --&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Is there a way so the final output Home looks like image 2 and the Create page looks like image 1</p>