Can I position div#d2 directly beneath the div#d1 container according to the code below, instead of positioning it outside the height of the wrapper?
#wrapper {
height: 100%;
display: flex;
background-color: steelblue;
align-items: center;
min-height: 100%;
/* fallback style for browsers that do not support the `vh` unit */
min-height: 100vh;
}
#d2 {
margin-top: 0.25rem;
text-align: center;
background-color:#336712;
}<body>
<div id="wrapper">
<div id="d1">lorem ipsum</div>
</div> <!-- #wrapper -->
<div id="d2">This should appear .25rem's under #d1 container</div>
</body>Here is a visual representation of my goal: https://i.stack.imgur.com/S1ocl.png