How to force superscripts inline ?

[JustinTeim]

Is there a CSS script I can add (or any other solution) to force superscripts (or subscripts) to be "inline" (on the same level as the text) ? I have tried reducing the font size for the superscripts, and increasing the line spacing, but neither is a good solution. Thanks in advance for any suggestions.

[gbm]

Originally Posted by JustinTeim

Is there a CSS script I can add (or any other solution) to force superscripts (or subscripts) to be "inline" (on the same level as the text) ? I have tried reducing the font size for the superscripts, and increasing the line spacing, but neither is a good solution. Thanks in advance for any suggestions.

I use:

 line-height: 0;

or

 line-height: normal;

bernie

[JustinTeim]

Bernie, Thanks for your reply. I went to
preferences/conversion/common options/look & feel/styling/Extra CSS
and added:
.end-note { line-height: 0; }
but it does not change the output. I am a 'newbie' to CSS, so apologies in advance, but....any idea what I'm doing wrong? (I did also try "line-height: normal;").
Thanks !

[pdurrant]

I beleive the only way around this problem is to have a fixed line height, e,.g.

line-height: 1.2em;

But this will annoy people who like to have a different line height on their reader.

[JustinTeim]

Thanks, pdurrant; Unless I'm doing something wrong, pasting
sup {
line-height: 1.2em;
}
in Look & Feel / Styling / Extra CSS

does not solve the problem (the superscript is still elevated so that it changes the line spacing).

[gbm]

Originally Posted by JustinTeim

Thanks, pdurrant; Unless I'm doing something wrong, pasting
sup {
line-height: 1.2em;
}
in Look & Feel / Styling / Extra CSS

does not solve the problem (the superscript is still elevated so that it changes the line spacing).

You will have to use the ebook editor, do not do during conversion.

See screenshot I find were a sup or sub is used, get the css property name see the highlighted areas in the File preview and text editor sections.



See screenshot two I go to the css file and edit the css property values.

Note these are just the general ones that I use, for some I will add font bold and letter spacing--example a linked footnote.



See screenshot three for what is looks like in the calibre ebook viewer.



bernie

[JustinTeim]

There is a learning curve here. :-( I will tackle this next weekend. Thank you very much!!

[Brett Merkey]

@Justin:
You haven't fully described what you mean by "inline" superscripts or what your goal is in terms of usage. The style property to use normally to keep superscripts inline is vertical-align. Values of this is what you want probably.

Here are two rulesets I use all the time: the first SUP is for footnotes references and the like. The SUP with class "ordinal" is what I use for ordinal numbers (like 1st, 2nd, etc.)

sup {
   vertical-align: super;
   font-size: 0.8em;
   padding: 0 4px;
   font-weight: bold;
}
sup.ordinal {
   vertical-align: text-top;
   font-size: 0.8em;
   padding: 0;
   font-weight: normal;
}

vertical-align: text-top; forces the superscript text to stay below the normal top of a font height. It is a nice effect and probably what you want.

[kovidgoyal]

You can actually do this fairly easily using the "Transform styles" feature of the Look & feel section of the conversion dialog. Create a rule something like:

If the vertical-align is not baseline remove the property.