Quote:
Originally Posted by Jellby
In your current example, the <div class="line"> is unneeded, you could have ".verse p" instead. (I use "poetry" and "stanza" to independently set spacing between stanzas and between poems and normal text.)
|
I see what you mean. In this file I don't have any regular text. I changed it to the following.
Code:
<div class="verse">
<p>Ease the bowspring,</p>
<p>Gently set the foresheets on the windward side.</p>
<p>Let go fore and aft & as she turns,</p>
<p>Sail her full & by to catch the evening tide.</p>
</div>
<div class="verse">
<p>Shake out your topsails,</p>
<p>Feel the seas roll under that she knows so well.</p>
<p>Find a star to guide her to the dawn,</p>
<p>And then let her greet the long Atlantic swell.</p>
</div>
<div class="chorus">
<p>cho: Sing me a shanty</p>
<p>Cantar del Cabo San Vicente</p>
<p>Chantez des marins de Nile</p>
<p>Sing a hymn of Trafalgar</p>
</div>
Quote:
Originally Posted by Jellby
And to further simplify, you could discard the "display: block", that's default for <div> and <p> anyway...
|
Quote:
Originally Posted by Jellby
...and use the shortcut notation for margins: "margin: 0; margin-left: 1em".
|
Quote:
Originally Posted by Jellby
Why did you split the margin-left between ".verse" and ".line p"?
Code:
.verse {
margin-bottom: 0.5em;
}
.verse p {
margin: 0;
margin-left: 1em;
text-indent: -1em;
}
|
It was a mistake as your question pointed out in the politest way possible. My revised code looks like this...
Code:
.verse {
margin-bottom: 0.5em;
}
.verse p {
margin-bottom: 0;
margin-left: 1em;
text-indent:-1em;
margin-right: 0;
margin-top: 0em
}
.chorus {
margin-bottom: 0.5em;
}
.chorus p {
margin-bottom: 0;
margin-left: 2em;
text-indent:-1em;
margin-right: 0;
margin-top: 0em
}
...in order to put
half a blank line at the bottom of the verse and the chorus, and in order to indent the second line of a line that "wraps", and in order to indent the chorus to make it different from the verses.
What do you think?