[SeaCanary]

Originally Posted by Jellby

I'd rather:

<div class="poetry">
 <div class="stanza">
  <div class="line">Now Boney's away from his warring and fighting,</div>
  <div class="line">He has gone to a place, where there is naught can delight him,</div>
  <div class="line">He may sit there &amp; dwell, on the glories he has seen oh,</div>
  <div class="line">While forlorn he will mourn, on the Isle of Saint Helena.</div>
 </div>

 <div class="stanza">
  <div class="line">No more in Saint Cloud, will he appear in great splendour,</div>
  <div class="line">Nor come forth from the crowd, like the great Alexander,</div>
 </div>
</div>

Using containers lets you use more selectors, and it's easier to control the spacing between verses and normal text, for instance. Using <div> instead of <p> for the individual lines is a matter of taste, because the lines are not actually paragraphs; it also degrades more gracefully if CSS is not completely/correctly supported, and does not force you to override margins/indents from normal paragraphs.

For the margin/negative indent of the verses, I'd use a larger value, to make it more evident when verses are broken, and avoid confusion with other poetry indent.

As for the actual separation between stanzas, I use margin-top:0.5em in div.stanza.

I like this though I found a way to simplify the code.

HTML code Note how I nested one <div> within another as you suggested.

<div class="verse">
  <div class="line">
    <p>Now Boney's away from his warring and fighting,</p>
    <p>He has gone to a place, where there is naught can delight him,</p>
    <p>He may sit there &amp; dwell, on the glories he has seen oh,</p>
    <p>While forlorn he will mourn, on the Isle of Saint Helena.</p>
  </div>
</div>

<div class="verse">
  <div class="line">
    <p>No more in Saint Cloud, will he appear in great splendour,</p>
    <p>Nor come forth from the crowd, like the great Alexander,</p>
    <p>He may look toward the East, while he thinks upon Lucana,</p>
    <p>While his heart is full of woe, on the Isle of Saint Helena.</p>
  </div>
</div>

CSS code The second declaration defines the properties of paragraphs that are inside a class “line” division. (I took your suggestion to decrease the margin-bottom value to 0.5em.)

.verse {
    display: block;
    margin-bottom: 0.5em;
    margin-left: .5em;
    text-indent:-1em;
    margin-right: 0;
    margin-top: 0em
    }
.line p {
    display: block;
    margin-bottom: 0em;
    margin-left: .5em;
    text-indent:-1em;
    margin-right: 0;
    margin-top: 0em
    }

Thanks everyone!


Bonus
The isle of St. Helena, song / Stuart Carolan, singing in English