Is it possible to include the pseudo element inside it's parent element css

Question

I would like to format my css such that each relevant element is within their own class, including the class's pseudo-elements. Currently, the pseudo-element is formatted this way.

element {
   ...
}

element::after {
   ...
}

Is it possible to format the above into this format? Basically nesting the pseudo-element inside it's parent element.

element {
   ...
   element::after {
      ...
   }
}

Answer 1

Not with vanilla css.
You have a few options, such as Scss, Less, Stylus and Postcss(with a plugin).

If you're just starting, I'd recommend Scss:

.element {
  &::after {
  }
}