Maybe you could use svg images as raised caps. You'll need to create svg images for each raised caps but are very simple to write them. For example:
1. In the .css stylesheet goes:
Code:
h1 {
font-size: 1.4em;
text-align: center;
margin-bottom: 2em;
}
p {
font-size: 1em;
text-align: justify;
text-indent: 0;
margin: 0;
}
p + p {
text-indent: 1.2em;
}
2. In the Images folder of Sigil you need to have something like:
Code:
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg"
width="70" height="90">
<defs>
<style type="text/css">
<![CDATA[
@font-face {
font-family: "Marnie";
src: url("../Fonts/Marnie.ttf");
}
]]>
</style>
</defs>
<text x="0" y="90" style="font-size: 90px" font-family="Marnie">
L
</text>
</svg>
I saved the image above as "L.svg". All yours svg images will be the same except that you'll have to change the letter "L" for the letter you want.
3. In your .xhtml file you should have something like:
Code:
<h1>This is the title</h1>
<p><img alt="L" src="../Images/L.svg" />orem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus. Donec metus ligula, elementum at pellentesque pellentesque, suscipit ac nunc. Etiam lobortis, massa ac aliquam auctor, augue nisl sagittis urna, at dapibus tellus erat ullamcorper ligula.</p>
This works for .kf8 and also for ADE
However you can get a raised cap in ADE without need a svg image
Finally, a drawback

I used as font-size in the svg images "pixel" as unit. That avoids that the raised cap changes its size when you change the device font-size. To achieve that, we would need to set the font-size in the svg images in "em" unit. In theory, svg supports "em" but I never could get that svg accepts "em"

So, that is all we have.
Below you can check the respective epub.
Regards
Rubén
EDIT: I forgot to tell you that in Sigil you won't see the custom font in the svg images; that is a bug of Sigil (and some web browser like Firefox). However it will be displayed properly in Kindle.
EDIT II: By remembering a trick that I use with my svg fleurons, I could get that the "svg image raised-cap" changes its size when you change the device font-size. To do this, add the following class to your stylesheet:
Code:
.raised_cap {
display: inline;
width: auto;
height: 4em;
}
and in the .xhtml file use:
Code:
<h1>This is the title</h1>
<p><img class="raised_cap" alt="L" src="../Images/L.svg" />orem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus. Donec metus ligula, elementum at pellentesque pellentesque, suscipit ac nunc. Etiam lobortis, massa ac aliquam auctor, augue nisl sagittis urna, at dapibus tellus erat ullamcorper ligula.</p>
Now you have what you want

I made the respective changes in the epub attached to this post.