title: height: auto on flex item when parent's height is 100vh
body: <p>How to set flex child's height to auto when its <strong>parent's position is fixed</strong> and height is 100vh. the code as following below (class=&quot;firstInnerDiv&quot; is my popup)</p>
  <pre><code>&lt;style&gt;
  .maindiv{
      position:fixed;
      display:flex;
      justify-content:center;
      left:0%;
      top:0%;
      width:100%;
      height:100vh;
      overflow-y:scroll;
      background:#8c8c8c;
     }
  
  .maindiv .firstInnerDiv{
      padding:0px 20px;
      margin-top:70px;
      border-radius:18px;
      height:auto;
      position:relative;
      width:80%;
      background:#fff;
   }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class=&quot;maindiv&quot;&gt;
  &lt;div class=&quot;firstInnerDiv&quot;&gt;
  &lt;p&gt;1. More contents will be here &lt;/p&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>jsfiddle as follows</p>
  <p><a href="https://jsfiddle.net/vjyrftxy/" rel="nofollow noreferrer">link to jsfiddle</a></p>