I am so sorry for the basic question in CSS, but this has caused me a loss of sleep!
I have two divs, the red and the blue; I need the red to be on top and the blue below, and I need the blue to move with the red (the setup of the red div is below). The requirement is that:
A = 0.06 * B
C = 0.06 x D
.red-div {
top: 10vh;
height: 45vh;
position: absolute;
aspect-ratio: 0.562;
left: 50%;
margin-right: -50%;
transform: translate(-50%, 0);
background: red;
border-radius: 60%;
}
.blue-div {
top: 5vh;
height: 70vh;
position: absolute;
aspect-ratio: 0.6;
left: 50%;
margin-right: -50%;
transform: translate(-50%, 0);
background: blue;
}
<div class="blue-div">
</div>
<dov class="red-div">
<div>
Is this even possible in CSS? is there a way to bind the position of one div to the other this way?
