@elyyyse
Posted
Hey, Cesar - I also get a little flummoxed by the position property. I don't know much about Tailwind, but with plain CSS — the thing you want you want to stick in place (the button) needs to be position: absolute, and the container you want to stick it to (the advice box) needs to be position: relative.
And then to get it to hang off the bottom of the box like it does in the design, you want to give the button a bottom of negative half the height of itself. So something like this:
container {
position: relative;
}
button {
position: absolute;
bottom: -30px; /* assumes the button is 60px tall */
}
That bottom: -30px; is saying, "stick to the bottom of the box, but move down 30px." A positive number would move it upward. So long as the button stays the same size, you shouldn't have problems with it moving around. I hope this helps!
Marked as helpful
