| <!DOCTYPE html> |
| <style> |
| .outer { |
| text-decoration: underline; |
| } |
| .middle { |
| position: absolute; |
| top: 50px; |
| } |
| .inner { |
| text-decoration: none; |
| } |
| |
| .override { |
| position: static; |
| } |
| </style> |
| <div class="outer"> |
| <div class="middle"> |
| This text should not inherit text-decoration from its parent, and should therefore not be underlined. |
| <p> |
| <a href="www.example.com" class="inner">As the child of an absolutely positioned block, this link should not be underlined</a> |
| </div> |
| </div> |
| <div class="outer"> |
| <div class="middle override"> |
| <a href="www.example.com" class="inner">As the child of a statically positioned block, this link should be underlined</a> |
| </div> |
| </div> |
