CSS :after Behavior and Element Compatibility
The CSS :after property extends content after an element in its document flow. However, not all elements seem to support this behavior. Why does :after only work with certain elements?
Answer: Replaced Elements vs. Non-Replaced Elements
According to the CSS specification, only non-replaced elements can have :before and :after properties. Replaced elements have their appearance and dimensions determined externally, including elements like images, plugins, and form controls.
What are Replaced Elements?
Replaced elements include:
