0

I have a question that I think I know but wants verification.

If we have

<div class="parent">
  <p>ABC</p>
</div>

and

.parent
{
  position: relative;
  ...
  /* these two attributes prove that .parent:before is positioned relative to .parent */
  top: 50px;
  left: 50px;
}

.parent:before
{
  position: absolute;
  left: 0px;  
  ...
  content: "XYZ";
}

Is .parent:before positioned relative to .parent? It appears to be so. Look at this jsfiddle:

https://jsfiddle.net/5oejdy2p/3/

We can see from jfiddle that XYZ is positioned relative to .parent. Because .parent is relatively positioned,

top: 50px;
left: 50px;

we see that XYZ moves with .parent.

Just need verification that I am correct.

Logan Lee
  • 65
  • 1
  • 2
  • 7

1 Answers1

0

Yes, you are right. Pseudoelements positioning relative to parent elements, if positioned as absolute.

Because pseudoelements are inner elements relative to parent

hisbvdis
  • 1,376
  • 1
  • 8
  • 11