Last post Feb 22, 2017 10:11 PM by A2H
Feb 22, 2017 05:31 PM|anooshiravan|LINK
hi I have this code:
<h3>This is h3</h3>
<p>a paragraph sibling for the h3</p>
<p><p>is it a sibling to h3?</p></p>
<p>is it a sibling to h3?</p>
and it is shown in MS edge like this:
a paragraph sibling for the h3
is it a sibling to h3?
why are the two last elements getting the style of the siblings?
Feb 22, 2017 05:48 PM|A2H|LINK
You are using
General Sibling Selector ie the element being selected doesn't need to immediately succeed the first element, but can appear anywhere after it.
If you want to style only the adjacent element then you can use adjacent selector i.e change ~ to + symbol in css
Change your css like below
Feb 22, 2017 08:46 PM|anooshiravan|LINK
but I supposed that siblings must be the children of the same parent.
for example if I put the last paragraph inside a <h1></h1> element it will not have that style anymore.
although in the code I posted I assume that the last paragraph isn't the child of the same parent as the <h3></h3> element anyway.
Feb 22, 2017 10:11 PM|A2H|LINK
You could take a look at this link which talk about the issue
you are facing