i ‘m beginner in css, i can’t put div after
for example:
i want to put red div after green div (in image)
[1]: https://i.stack.imgur.com/PSYtu.png
but i want to make divs sticking to the edges of the screen .
i tried :
.green {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 50%;
background-color: green;
margin-bottom: 5px;
}
.red {
position: absolute;
left: 0;
width: 100%;
height: 50%;
background-color: red;
}
<div class="green">
</div>
<div class="red">
</div>
>Solution :
If you just write this code with relative positions I think will do the work. But following your example (where you set the position as absolute) I let you the following code. I don’t know if it is what do you expect, if it isn’t, please com back with more details.
.green {
position: absolute;
width: 100%;
top: 0;
left: 0;
width: 100%;
height: 50vh;
background-color: green;
margin-bottom: 5px;
}
.red {
position: absolute;
top:0;
left: 0;
width: 100%;
height: 50vh;
background-color: red;
transform: translateY(100%);
}
<div class="green">
</div>
<div class="red">
</div>