This is a useful bit of CSS I came across for getting the hanging indent working correctly for Works Cited or Reference entries in HTML. Here’s the CSS:

p.reference {
padding-left: 2em;
text-indent: -2em;
}

Now the HTML, for example:

<p class="reference">Sturluson, Snorri. <em>The Prose Edda: Norse Mythology</em>. Trans. Byock, Jesse L. London: Penguin, 2005. Print.</p>
<p class="reference">Tennyson, Alfred Lord. <em>Idylls of the King</em>. New York, New York: Penguin Putman Inc, 1983. Print.</p>

Generates…

Sturluson, Snorri. The Prose Edda: Norse Mythology. Trans. Byock, Jesse L. London: Penguin, 2005. Print.

Tennyson, Alfred Lord. Idylls of the King. New York, New York: Penguin Putman Inc, 1983. Print.

Alternatively, you can do this styling in-line with your <p> tags as follows:

&lt;p style=”padding-left: 2em; text-indent: -2em;”&gt;Sturluson, Snorri. The Prose Edda: &lt;em&gt;Norse  Mythology&lt;/em&gt;. Trans. Byock, Jesse L. London: Penguin, 2005. Print.&lt;/p&gt;

And you still end up with …

Sturluson, Snorri. The Prose Edda: Norse Mythology. Trans. Byock, Jesse L. London: Penguin, 2005. Print.

Thanks to the work done on this page for the help here. Happy trails :)

[ad name=”Leaderboard Banner 01″]

APABibliographyCSSHTMLMLAReferencesWorks Cited