Use a combination of position relative and absolute to place text on the image (cute cat included) card.
Combination of positions
- First, we wrap everything with
- Then, we render our cute cat image with
.titleclass which is positioned absolutely.
- The above
h2element will look for the closest container that has a
absoluteposition which is our
.containerclass and position absolutely to it.
- Understanding CSS positions is a crucial aspect to succeed in creating application layouts.
- Transforms can be useful for centering content vertically or horizontally.
- Never skip your CSS day as it'll hit you earlier than you think. 😅