CSS selector ::after didn't work in HTML Embed

Design help General
1

I really appreciate many great people in this forum who always try to help beginners like me.

I encountered another problem to format styling.
I want to use ::after selector and added HTML Embed at the below of image element.
However, it didn’t work.

My example code inside HTML Embed is

.hero-image::after {
background-color: grey;
height: 300px;
}

Am I missing something?

Thanks

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

If you want to add 300px after an image, add the rule padding-bottom or margin-bottom to the class of the image.

Pseudo elements ::after and ::before are used to add content to an element, with the rule content: url(smiley.gif);" for example.

CSS rules set for ::after are applying to what ::after is adding. For example:

.exciting-text::after {
  content: " <- EXCITING!"; 
  color: green;
}
1 Like
3

Yes, stupidly I forgot to add it… Thank you for pointing it out.