[SORTA-SOLVED]Poetry in HTML - P tags aren't right...
Posted: Sun May 29, 2005 3:50 pm
Since I run a "fiction-publishing" type of site, I have to handle fiction and poetry. Currently, I'm redeveloping my paragraph() function. What does it do? It, as it suggests, takes plain or HTML text and then turns it into paragraphs. Originally, I did it all via <br />s, but now I want to have contextual paragraphs, and I'm taking to wrapping them in <p>s.
This is all fine and dandy when it doesn't really matter whether or not there's a space between paragraphs (like just now), but what about poetry?
Okay, here is our cleartext. Each line is well defined, and it would be nice if I could operate on each line. You can use P tags for this, doing something like this:
But this is unacceptable, because if you were to copy and paste the text, it would have spaces between them: not good.
Taking another look at the HTML 4.1 spec ( http://www.w3.org/TR/REC-html40/struct/text.html specifically ), one sees no other way to divvy up the lines. That presents us with two options:
Parse it like this:
Which treats the stanza as a coherent entity with linebreaks, or
The stanza classes putting in the vertical margins. Unfortunantely, this isn't satisfactory either because:
1. We still lose our "stanza space" when we copy and paste
2. The contextual meaning of <div> is null
Is there a solution to this problem? What would you recommend I do?
This is all fine and dandy when it doesn't really matter whether or not there's a space between paragraphs (like just now), but what about poetry?
Code: Select all
When I happened to ask this brain,
he seemed to be under a great strain.
When he answered my question, which was thirty one hours later,
When he called in a waiter.
The waiter went into a trance,
And poked me with her large lance.
Then she told the whole story,
A true one that was extremely gory.Code: Select all
P {margin:1.3em 0;} /*The Default*/
.np {margin:0;}Code: Select all
<p class="e;np"e;>When I happened to ask this brain,</p>
<p class="e;np"e;>he seemed to be under a great strain.</p>
<p class="e;np"e;>When he answered my question, which was thirty one hours later,</p>
<p class="e;np"e;>When he called in a waiter.</p>
<p class="e;np"e;>&nbsp;</p>
<p class="e;np"e;>The waiter went into a trance,</p>
<p class="e;np"e;>And poked me with her large lance.</p>
<p class="e;np"e;>Then she told the whole story,</p>
<p class="e;np"e;>A true one that was extremely gory.</p>Taking another look at the HTML 4.1 spec ( http://www.w3.org/TR/REC-html40/struct/text.html specifically ), one sees no other way to divvy up the lines. That presents us with two options:
Parse it like this:
Code: Select all
<p>
When I happened to ask this brain,<br />
he seemed to be under a great strain.<br />
When he answered my question, which was thirty one hours later,<br />
When he called in a waiter.<br />
</p>
<p>
The waiter went into a trance,<br />
And poked me with her large lance.<br />
Then she told the whole story,<br />
A true one that was extremely gory.<br />
</p>Code: Select all
<div class="e;stanza"e;>
<div>When I happened to ask this brain,</div>
<div>he seemed to be under a great strain.</div>
<div>When he answered my question, which was thirty one hours later,</div>
<div>When he called in a waiter.</div>
</div>
<div class="e;stanza"e;>
<div>The waiter went into a trance,</div>
<div>And poked me with her large lance.</div>
<div>Then she told the whole story,</div>
<div>A true one that was extremely gory.</div>
</div>1. We still lose our "stanza space" when we copy and paste
2. The contextual meaning of <div> is null
Is there a solution to this problem? What would you recommend I do?