How to make rising water animation

Question

Help me to spread blue rectangle with the top side, and the bottom side fixed, using only css?
https://code.sololearn.com/W7Ts1Kaph8qH/?ref=app

Answer 1

position fixed
bottom 0

in keyframes, change its height

Answer 2

Top side and bottom side fixed? Can you elaborate more on this? Should the blue rectangle fill up like water from bottom to top, or do you want the top left and bottom left corner to not move while the rectangle expands sideways?

Answer 3

Fermi, I mean the bottom side fixed, but the top side widens like rising water

Answer 4

Thanks Gordon, you helped me the second time for the completion of my code 😊, and now after i put fixed position, it can works too with absolute 👏👏👏