<html>
<head>
<style>
span { outline: 10px auto purple; position:relative }
div { margin: 1em 0; }
</style>
</head>
<body>
<div>Outline ring painting test.</div>

<div><span>Content before.
<h3>Bold with margin.</h3>
Content after</span></div>

<div><span><h3>No content before.</h3>Content after.</span></div>

<div><span>Content before<h3>But No Content After</h3></span></div>

<div><span><h3>No content before or after.</h3></span></div>