Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 07-08-2011, 11:09 PM   #1
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 9,243
Karma: 42056120
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
Superscript best practices?

I'm probably being a little persnickety, but does anyone have some CSS that consistently produces desirable superscript results across a variety of readers/applications? Superscript links for endnotes is where I'm ultimately going with this.

Just from an html standpoint, I tend to use the following CSS applied to a <span> element:
Code:
/* End note superscript style */
.end-note {
    font-size: .80em;
    vertical-align: baseline;
    position: relative;
    bottom: .6em;
    }
And the html would look like:
Code:
<span class="end-note"><a href="../Text/EN3.xhtml" id="EN3">3</a></span>
I find that seems to look the best... and doesn't mess with the line-spacing at all. However... ADE just seems to ignore that CSS and my poor number three is vertically aligned with the rest of the surrounding text. The only CSS I can get ADE to respect (with regard to superscripts) is:
Code:
/* End note superscript style */
.end-note {
    font-size: .80em;
    vertical-align: .6em;
    }
Which unfortunately, when I get the superscript jacked up to where I think it looks good, really starts butchering the line-spacing. It makes for ugly paragraphs. Does anyone have a "one-size fits all" solution that will maintain a consistent line-spacing when using ADE or any other readers/apps?

Last edited by DiapDealer; 07-08-2011 at 11:13 PM.
DiapDealer is online now   Reply With Quote
Old 07-09-2011, 03:43 AM   #2
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 6,189
Karma: 4800739
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
I use simply:

Code:
a.note {
  font-size: 75%;
  vertical-align: text-top; /* doesn't affect line height */
}

<a class="note" href="../Text/EN3.xhtml" id="EN3">3</a>
or:

Code:
sup { /* this is already rendered as superscript */
  font-variant: normal; /* for use in smallcapped text */
  line-height: 0; /* do not alter the line separation */
}

M<sup>me</sup> de Bellière
Jellby is offline   Reply With Quote
 
Enthusiast
Old 07-09-2011, 06:34 AM   #3
mrmikel
Book Twiddler
mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.
 
Posts: 2,086
Karma: 1444487
Join Date: Apr 2008
Location: Central Oregon Coast
Device: PRS-300
Since it depends on each reader there is no way to show superscripts easily across a variety of devices. Some people, myself included, tend to show them as bracketed numbers [1].

But that gets awkward when the text includes them and refers to them, as it did in a recent book I worked on.

Those viewing epubs on bigger screens can get away with smaller superscripts. They require a microscope on my Sony Reader.
mrmikel is offline   Reply With Quote
Old 07-09-2011, 08:14 AM   #4
charleski
Wizard
charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.
 
Posts: 1,188
Karma: 727236
Join Date: Sep 2009
Device: PRS-505
The method I use is outlined here. This prevents ugly variations in line spacing in ADE and allows you to alter the vertical position of the superscript by changing the line-height.

Obviously, the reader application should really handle superscripts properly without having to resort to tricks to avoid irregular line-spacing, but this is the result of a fault in CSS2 itself. The readers are merely applying the (defective) standard.

Last edited by charleski; 07-09-2011 at 08:20 AM.
charleski is offline   Reply With Quote
Old 07-09-2011, 10:53 AM   #5
roger64
Wizard
roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.
 
Posts: 1,439
Karma: 846401
Join Date: Jan 2009
Device: KoboGlo
Hi

This is another problem people using LibreOffice and Writer2xhtml do not have to worry with.

They select either Style/superscript or Insert/endnote while textprocessing to write (nothing really unusual) and when they export to EPUB, this is how the end result looks like: (This is a Sigil view extract, text on top, code lower)



Of course, if you are not happy with the style you can modify character styles or endnotes characteristics in LibO like you wish to suit your needs.
roger64 is offline   Reply With Quote
Old 07-09-2011, 12:08 PM   #6
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 9,243
Karma: 42056120
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
Thanks guys!

Jelby's second example is the one that works the best for me. Thanks for the suggestion Roger, but I since I'm going to end up in a code editor before the ebook is done anyway... I prefer to just start in a code editor from the get go. Using a word processor, then exporting (or using a plugin), and then tweaking the resulting code just isn't my cup of tea.
DiapDealer is online now   Reply With Quote
Old 07-10-2011, 02:20 AM   #7
roger64
Wizard
roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.
 
Posts: 1,439
Karma: 846401
Join Date: Jan 2009
Device: KoboGlo
Quote:
Originally Posted by DiapDealer View Post
Using a word processor, then exporting (or using a plugin), and then tweaking the resulting code just isn't my cup of tea.
Of course, your choice for your book is the best. Thank you for commenting it, most don't do it.

I will just comment, if I may, in a general way because I also had the opportunity to produce some books and like you, I do not like to tweak the resulting code and I limit it to the utmost.

My point is that, with a reasonably complex book, you can now make an EPUB without tweaking the resulting code.

What's a reasonably complex book ? One including any text using styles, lots of notes, tables, ordered lists, TOCs, meta-data, images of nearly any kind, including floating images, adding custom style sheets, embedding fonts and more. You just have to use LibreOffice with the standard odt format. I sincerely says it covers 99% of ebook production needs though I did not do any statistical study of any kind. My feeling.

This can be produced within LibreOffice and exported straightaway as an EPUB within LibreOffice using its extension writer2xhtml. It's very comfortable indeed.

Why are people using code editors then? This is a puzzling question.
I would say there are always exceptions to any rule *, that not everybody produces text in odt format and that diversity is the salt of mankind.

* For the time being, for example drop-caps are one of them, but that may change soon.

PS: Here is an example where I made use of another feature, automatic style-mapping of style attributes.
Attached Files
File Type: epub Lorem Ipsum.epub (74.0 KB, 85 views)

Last edited by roger64; 07-10-2011 at 03:40 AM. Reason: example
roger64 is offline   Reply With Quote
Old 07-10-2011, 04:20 AM   #8
Toxaris
Wizard
Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.
 
Toxaris's Avatar
 
Posts: 3,002
Karma: 3440001
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-300, PRS-T1
Quote:
Originally Posted by roger64 View Post

Why are people using code editors then? This is a puzzling question.
I would say there are always exceptions to any rule *, that not everybody produces text in odt format and that diversity is the salt of mankind.
I can't speak for others, but I don't want an additional word processor like LibreOffice on my laptop. I already have Office, which I also need for my work. I have some very good Word macro's that do a lot of post-OCR processing and takes out an enormous amount of errors. The export to filtered is not ideal (understatement...), but it a macro is developed to solve that.
What is more, I like to have control over the code. I have some standards regarding to the code and things I want and don't want.
Even if I would use a plugin like this, I still would manually check and alter the code.

For what it is worth, I tried working with LibreOffice, OpenOffice, StarOffice and so on, but I did not like it... The wordprocessor is reasonable, but the rest was not up to par for me.
Toxaris is offline   Reply With Quote
Old 07-10-2011, 05:09 AM   #9
roger64
Wizard
roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.
 
Posts: 1,439
Karma: 846401
Join Date: Jan 2009
Device: KoboGlo
Hi Toxaris,

I heard about Word users and their lingering html conversion problems. True, if you do not like LibreOffice, there is nothing it can do for you. But this is your choice. Fair enough.

But...

Quote:
Originally Posted by Toxaris View Post
What is more, I like to have control over the code. I have some standards regarding to the code and things I want and don't want.
I would be just curious to know which "standards" the xhtml transcription made by writer2xhtml is infringing upon?

I can tell you that, provided the user made a clean work out of his odt file, his EPUB code will be spotless clean too. The main point is easy to remember, it's to use styles throughout in the odt. The user has total control over it.

Furthermore, you also can customize automatic style-mapping options (for styles or style attributes) to suit your tastes.

If an odt file is a mess though, with a lot of "hard formatting" for example, well, then probably the garbage in, garbage out rule will apply... It makes really very clean work but does not perform any miracles yet.

Last edited by roger64; 07-10-2011 at 05:38 AM. Reason: so many mistakes
roger64 is offline   Reply With Quote
Old 07-10-2011, 06:29 AM   #10
charleski
Wizard
charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.
 
Posts: 1,188
Karma: 727236
Join Date: Sep 2009
Device: PRS-505
roger64: The epub you posted produces exactly the sort of ugly variation in line spacing that must be avoided. It does this in both ADE and calibre's reader, because that's what's specified in the css standard. The sup tag needs to be modified in the css to reduce the line-height in order to prevent this. See my earlier post for an example of what superscripts should look like. Jellby's method and mine are essentially the same, though mine allows a bit more control over vertical positioning.

Last edited by charleski; 07-10-2011 at 06:32 AM.
charleski is offline   Reply With Quote
Old 07-10-2011, 09:55 AM   #11
roger64
Wizard
roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.roger64 ought to be getting tired of karma fortunes by now.
 
Posts: 1,439
Karma: 846401
Join Date: Jan 2009
Device: KoboGlo
Hi Charleski

One of the pleasures of MR is that we may have constructive threads. Thanks all of you for your insight and research on this field. To be honest, I really did not dig so deep in superscript.

To sum it up for my point:

Writer2xhtml produces an xhtml code which is very respectful of standards. One of its advantages is to drastically reduce the necessity of code tweaking.

The latter remains necessary at times, for example for drop-caps and nicely customized superscript tags.

Somebody disagrees?

Last edited by roger64; 07-10-2011 at 09:59 AM.
roger64 is offline   Reply With Quote
Old 07-10-2011, 11:20 AM   #12
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 9,243
Karma: 42056120
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
Quote:
Originally Posted by roger64
Somebody disagrees?
I don't disagree at all... it seems like a nice plugin. It just won't fit into my workflow.

The problem is, LibreOffice and the Writer2xhtml plugin, just don't have anything to do with my original question. I wasn't looking for a program to do something for me. I was looking for some in depth, behind the scenes, code-level details on how to get superscripts to behave in a consistent manner across a variety of ereaders and applications. I got those details from Jelby and charleski's examples.

It seemed like I only got an advertisement/endorsement from your post. And in fact, Writer2xhtml will generate the same line-spacing issues (with superscripts) that prompted me to ask my question in the first place! Nothing wrong with a little advertising, but make sure it meets someone's needs before you do it.
DiapDealer is online now   Reply With Quote
Old 07-10-2011, 12:39 PM   #13
Toxaris
Wizard
Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.
 
Toxaris's Avatar
 
Posts: 3,002
Karma: 3440001
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-300, PRS-T1
Quote:
Originally Posted by roger64 View Post
Hi Toxaris,

I heard about Word users and their lingering html conversion problems. True, if you do not like LibreOffice, there is nothing it can do for you. But this is your choice. Fair enough.

But...



I would be just curious to know which "standards" the xhtml transcription made by writer2xhtml is infringing upon?
Although Word gives bad HTML, cleaning up only costs me about 15-30 minutes now. After my macro is finished, it will take me a few minutes.

I am referring to my own standards. As an example, the example you gave earlier in the thread would not pass my standard. I tend to avoid attributes in spans and alike. I would transfer that always to a CSS stylesheet. I find it is ugly code. It is correct code, but not for me.
Toxaris is offline   Reply With Quote
Old 07-10-2011, 04:42 PM   #14
charleski
Wizard
charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.
 
Posts: 1,188
Karma: 727236
Join Date: Sep 2009
Device: PRS-505
Writer2xhtml is open source, so it could be modified to produce epubs using the correct css to prevent the line-spacing issue. It's highly modular, though, and the css generation used for ePub export is part of the more general style generation package, so I'm not sure if the author would want to modify it globally or just for epubs.
charleski is offline   Reply With Quote
Old 07-21-2011, 12:20 AM   #15
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
I've just attempted my first endnotes using Jellby's rule above:

a.note {
font-size: 75%;
vertical-align: text-top; /* doesn't affect line height */
}

Although mine reads:

span.endnote-ref {
font-size : 75%;
vertical-align : text-top;
}

This works great in the main body-copy, but in my smaller indented quotes, the endnote references actually come out larger than they do in the body-copy, when I was hoping they would appear smaller than the quotation paragraph style, which is:

p.quote {
font-family : Georgia, serif;
font-weight : normal;
font-style : normal;
font-size : 0.83em;
text-decoration : none;
font-variant : normal;
line-height : 1.2;
text-align : left;
color : #000000;
text-indent : 0px;
margin : 16px 32px;
}

How can I make the rule for "font-size: 75%;" apply to the paragraph style it is relevant to?
virtual_ink is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Best Practices for TOC in Mobi ldespain Kindle Formats 11 09-25-2010 08:54 PM
Superscript and Subscript ramjet1953 Sigil 1 06-13-2010 07:15 AM
Superscript in titles paulpeer Sigil 5 01-20-2010 08:37 AM
DTBook - best practices Nate the great Workshop 6 05-15-2009 04:06 AM
EPUB best practices guide Bob Russell ePub 25 04-01-2008 08:36 AM


All times are GMT -4. The time now is 02:30 PM.


MobileRead.com is a privately owned, operated and funded community.