Hi. My english is very limited, sorry.
I’m studying pinegrow’s bootstrap 5 examples. Some hero sections have the background as a pseudo element. Why and when to do it like this?
I normally use pseudo-elements in combination with background-images when it comes to overlaying colors.
But I use it the other way round. The class .poster would get the “background-image” and the :before would get a background-color or gradient as overlay! Maybe it also works this way you posted it, not sure about that without seeing everything. But that could be a possible reason!
2 Likes
I understand. Thank you for helping me in my learning.
You’re welcome and sorry for the late reply. Feel free to ask any questions here I’m sure the community will help you out if they can! 
1 Like
This is the way I prefer doing it as well. By making the image your main element, you can use Srcset, Lazy Loading, and other things that pseudo-element images can’t do.
4 Likes