0

I just wonder why the following page doesn't work properly. If I substitute p with a div or an a (anchor) (both for HTML part and for the single CSS definition), sibling selector ~ works properly. But if I use p or for instance h1, I can't get the expected outcome.

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Untitled Page</title>
    <style>
        p ~ h3{text-decoration:underline}
    </style>
</head>
<body>
    <p>here comes a paragraph
        <h3>child of p, thus should not be underlined</h3>
    </p>
    <h3>has the same parent with p, thus should be underlined</h3>
</body>
</html>

Without a doubt, I am missing something I should be aware of, but I can't find the relevant information on anywhere. I appreciate if one of you can provide the essential info. Thank you!

0 Answers0