View Single Post
Old 02-13-2012, 11:30 AM   #3
pdurrant
The Ghost 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: 32,180
Karma: 88959342
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