How the ::before and ::after pseudo-element works
Hello guys, sorry to disturb you all; I'm trying to understand how the ::before and ::after pseudo-element work but I have a few question:
1. In the video I'm watching, from what is being told, we should always use the content property irrespective if we have any text content or not; even though the text content is null, we should use empty quotation. My question is why is it so please, why can't we just ignore the content property in this case?
2. If ever we use the content property with empty quotations (that is we will be using the pseudo-element mainly for styling), if we set a height, width and background color, we won't see any visual drawing until we set the position to absolute. My question is, why we should explicitly set the position to absolute? Even if the position is set to relative, it doesn't work, why position of absolute is important here please
Here is the codepen where I'm trying to experiment:
https://codepen.io/Fakeur/pen/PoMdKZV
1. In the video I'm watching, from what is being told, we should always use the content property irrespective if we have any text content or not; even though the text content is null, we should use empty quotation. My question is why is it so please, why can't we just ignore the content property in this case?
2. If ever we use the content property with empty quotations (that is we will be using the pseudo-element mainly for styling), if we set a height, width and background color, we won't see any visual drawing until we set the position to absolute. My question is, why we should explicitly set the position to absolute? Even if the position is set to relative, it doesn't work, why position of absolute is important here please
Here is the codepen where I'm trying to experiment:
https://codepen.io/Fakeur/pen/PoMdKZV
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
