What I’m trying to do is have the title be ON the image itself and be there without the long container thing that separates the image and text. Is there another way to do this other than messing with the margins until I get the result that I want?
make the element
That does help but the text itself isn’t on the image right now so there isn’t anything actually BEHIND the text. I need help actually getting the text positioned on the image.
You will need to share a link to your code for more detailed help.
Here you go!
If I’m understanding what you’re asking then , In the CSS for the H2, set the background opacity
The following are the cross browser snippets.
/* IE 8 */
/* IE 5-7 */
/* Netscape */
/* Safari 1.x */
/* Good browsers */
position: absolute; color: white; /* Or the color of your choice */ left: 50%; transform: translateX(-50%);
You’ll also probably want to set the
position of the surrounding
relative — that will allow you to set a
top value for the
h2 that’s relative to its container rather than relative to the whole page.
Thank you this is exactly what I was looking for!
Strangely though the white box reappears if I change the position type. Any ideas?
*edit: Nevermind i fixed it by placing absolute text over a relative image.