| <!DOCTYPE html> | |
| <style> | |
| .link1, .link2 { | |
| text-decoration: none; | |
| color: green; | |
| } | |
| .link1::before { | |
| content: "before content "; | |
| text-decoration: underline; | |
| } | |
| .link1::after { | |
| content: " after content"; | |
| text-decoration: underline; | |
| } | |
| .link2::before { | |
| content: "before content "; | |
| position: absolute; | |
| top: 90px; | |
| } | |
| .link2::after { | |
| content: " after content"; | |
| position: absolute; | |
| } | |
| .underline { | |
| text-decoration: underline; | |
| } | |
| </style> | |
| <p>Test that text decoration is not inherited to a positioned :before/:after pseudo element.</p> | |
| <span class="link1"><span class="underline">normal content</span></span> | |
| <br> | |
| <span class="link2"><span class="underline">normal content</span></span> |