/* Container holding the image and the text */
.container position: relative;
text-align: center;
color: white;
>
/* Bottom left text */
.bottom-left position: absolute;
bottom: 8px;
left: 16px;
>
/* Top left text */
.top-left position: absolute;
top: 8px;
left: 16px;
>
/* Top right text */
.top-right position: absolute;
top: 8px;
right: 16px;
>
/* Bottom right text */
.bottom-right position: absolute;
bottom: 8px;
right: 16px;
>
/* Centered text */
.centered position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
>
To learn more about how to style images, read our CSS Images tutorial.
To learn more about CSS positoning, read our CSS Position tutorial.
