| <!DOCTYPE html> |
| <style> |
| div.container { margin: 16px 0; } |
| span.outer { font-size: 50px; background-color: white; font-family: ahem; } |
| span.inner { outline: 5px auto green; padding: 0 10px; } |
| </style> |
| <p> |
| This should be an unobscured fuzzy green polygon: |
| </p> |
| <div class="container"> |
| <span class="outer" style="position: relative;"> |
| <span class="inner"> |
| <div></div> |
| </span> |
| </span> |
| </div> |
| <p> |
| This is just for reference: |
| </p> |
| <div class="container"> |
| <span class="outer"> |
| <span class="inner"> |
| <div></div> |
| </span> |
| </span> |
| </div> |
