<p>The only thing I've found has been;</p>

<pre class="lang-css prettyprint-override"><code>.hang {
    text-indent: -3em;
    margin-left: 3em;
} 
</code></pre>

<p>The only way for this to work is putting text in a paragraph, which causes those horribly unsightly extra lines. I'd much rather just have them in a <code>&lt;span class="hang"&gt;&lt;/span&gt;</code> type of thing.</p>

<p>I'm also looking for a way to further indent than just a single-level of hanging. Using paragraphs to stack the indentions doesn't work.</p>

```
<span>
```
is an inline element. The term
hanging indent
is meaningless unless you're talking about a paragraph (which generally means a block element). You can, of course, change the margins on
```
<p>
```
or
```
<div>
```
or any other block element to get rid of extra vertical space between paragraphs.
You may want something like
```
display: run-in
```
, where the tag will become either block or inline depending on context... sadly, this is
not yet universally supported by browsers
.