View Single Post
Old 02-13-2012, 12:30 PM   #3
pdurrant
Santa Mouse
pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.pdurrant ought to be getting tired of karma fortunes by now.
 
pdurrant's Avatar
 
Posts: 33,296
Karma: 90609350
Join Date: Jul 2007
Location: Norfolk, England
Device: NOOK ST GlowLight
Quote:
Originally Posted by Derek R View Post
I have read a number of posts on the issue of creating indented lines and hanging indents in poetry in epubs, but haven't quite managed to find a definitive answer. In experimenting, I have come up with some code using an unordered list that seems to work:
[snip]
Don't use structures when just to get their default formatting. I'd suggest something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<head>
<style type="text/css">
p {
text-indent:0;
margin: 0;
}

div.poem {
margin-left:3em;
}
div.stanza {
margin-top: 1em; margin-bottom: 1em;
}

p.poemtitle {
font-size:2em;
font-weight:bold;
text-align: center;
}
p.line {
}
p.indentedline {
text-indent: 2em;
}

</style>
</head>
<body>
<div class="poem">
<p class="poemtitle">A Poem</p>
<div class="stanza">
<p class="line">Twilight and evening bell,</p>
<p class="indentedline">And after that the dark!</p>
<p class="line">And may there be no sadness of farewell,</p>
<p class="indentedline">When I embark.</p>
</div>
<div class="stanza">
<p class="line">For tho' from out our bourne of time and place</p>
<p class="indentedline">The flood may bear me far,</p>
<p class="line">I hope to see my Pilot face to face</p>
<p class="indentedline">When I have crost the bar.</p>
</div>
</div>
</body>

Uses the tags in the text to indicate the structure, and use the CSS to apply formatting to that structure.
pdurrant is offline   Reply With Quote