Fix dedication appearance

The dedication attempts to copy the style of the printed page but it doesn’t render correctly—on my device, “Elizabeth” is almost, but not quite, aligned with “and”.

If you want to copy the appearance of the printed page, a simple solution is to reuse the CSS for songs, poems, and verse.

You can recycle the CSS with:

[epub|type~="z3998:song"] p,
[epub|type~="z3998:verse"] p,
[epub|type~="dedication"] p{
    text-align: initial;
    text-indent: 0;
}

[epub|type~="z3998:song"] p > span,
[epub|type~="z3998:verse"] p > span,
[epub|type~="dedication"] p > span{
    display: block;
    padding-left: 1em;
    text-indent: -1em;
}

[epub|type~="z3998:song"] p > span + br,
[epub|type~="z3998:verse"] p > span + br,
[epub|type~="dedication"] p > span + br{
    display: none;
}

Then add the indent levels:

p span.i1{
    padding-left: 2em;
    text-indent: -1em;
}

p span.i2{
    padding-left: 3em;
    text-indent: -1em;
}

p span.i3{
    padding-left: 4em;
    text-indent: -1em;
}

Then place the content of the dedication in a <blockquote> with indentation:

<blockquote>
    <p>
        <span>To</span>
        <br/>
        <span class="i1">Colin</span>
        <br/>
        <span class="i2">and</span>
        <br/>
        <span class="i3">Elizabeth</span>
    </p>
</blockquote>

You can then remove the extra styling code in local.css. This should keep your CSS smaller and more predictable since you are reusing existing code.

jdecock / hugh-lofting_the-voyages-of-doctor-dolittle

Fix dedication appearance #8