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 03-28-2013, 08:41 PM   #1
HYPE
Groupie
HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.
 
HYPE's Avatar
 
Posts: 178
Karma: 1057078
Join Date: Dec 2012
Device: Kobo Aura One
<body> style

Hi there.

I'm currently working on a few ebooks. The creation process of most of them included converting from another format, so I didn't write all the CSS manually.

I noticed the following code in the CSS :

Code:
@page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; }

body {
    display: block;
    font-size: 1em;
    margin-bottom: 0;
    margin-left: 5pt;
    margin-right: 5pt;
    margin-top: 0;
    padding-left: 0;
    padding-right: 0;
}
Is all of this really necessary? What should I use for the body? I really want to give people a clean ebook, so every detail is important to me.

Thanks.
HYPE is offline   Reply With Quote
Old 03-28-2013, 10:14 PM   #2
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,645
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by HYPE View Post
Hi there.

I'm currently working on a few ebooks. The creation process of most of them included converting from another format, so I didn't write all the CSS manually.

I noticed the following code in the CSS :

Code:
@page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; }

body {
    display: block;
    font-size: 1em;
    margin-bottom: 0;
    margin-left: 5pt;
    margin-right: 5pt;
    margin-top: 0;
    padding-left: 0;
    padding-right: 0;
}
Is all of this really necessary? What should I use for the body? I really want to give people a clean ebook, so every detail is important to me.

Thanks.
This is the cleaned up code...

Code:
body {
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0;
}
I would add in widows: 0; and orphans: 0; to make the text end mostly at the same place at the bottom of the screen.

Now, if you want to have margins, use an @page to do so. But if you do so, don't add in a bottom margin. You don't need it.
JSWolf is offline   Reply With Quote
Advert
Old 03-29-2013, 03:39 AM   #3
HYPE
Groupie
HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.HYPE ought to be getting tired of karma fortunes by now.
 
HYPE's Avatar
 
Posts: 178
Karma: 1057078
Join Date: Dec 2012
Device: Kobo Aura One
Ah, great advice, thank you.
HYPE is offline   Reply With Quote
Old 03-29-2013, 04:17 AM   #4
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: 7,514
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Even simpler:

Code:
body { margin: 0; }
About widows, orphans and bottom margin, there are different opinions. Widows and orphans control whether you prefer blank lines at the bottom of your page or possibly a single word at the top of your next paragraph (in printed books, it's usual to avoid breaking a paragraph between pages at its first or last line).

Bottom margin, that depends on the reader. If a reader has no "status bar" at the bottom of the screen, then you'd want a bottom margin for the same reason you want a top one. With bottom-margin: 0 the bottom line letters could touch the edge of the screen (or even be cropped if the font has long descenders extending beyond the character box). Although Jon likes to promote this "no bottom margin" view, I think it's cleaner to just have an even margin around all sides, so I usually have:

Code:
@page { margin: 2mm; }
body { margin: 0; }
and I don't think it causes a problem for anyone.
Jellby is offline   Reply With Quote
Old 03-29-2013, 07:16 AM   #5
mrmikel
Color me gone
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,089
Karma: 1445295
Join Date: Apr 2008
Location: Central Oregon Coast
Device: PRS-300
I am of two minds. I don't want to give up any real estate on my 5" screen, but margins are prettier.
mrmikel is offline   Reply With Quote
Advert
Old 03-30-2013, 05:34 AM   #6
Turtle91
A Hairy Wizard
Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.
 
Turtle91's Avatar
 
Posts: 3,068
Karma: 18727053
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
Quote:
Originally Posted by mrmikel View Post
I am of two minds. I don't want to give up any real estate on my 5" screen, but margins are prettier.
Most of your current reader's allow the user to change the default margins anyway, so I would put in what looks good to you {margin:5px} or whatever. If the reader doesn't like it they can change it. If they have an older device that doesn't allow them to change it, then they just have to live with what the publisher thinks looks good (just like all pbooks for the last how many years??) - or they can go get themselves a new reader/device/app!
Turtle91 is offline   Reply With Quote
Old 03-30-2013, 09:06 PM   #7
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,645
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Most readers/reading apps do not go to the bottom of the screen. So just leave out the bottom margin. Leave it set to 0. Ignore any advice to do otherwise.
JSWolf is offline   Reply With Quote
Old 04-01-2013, 03:58 PM   #8
Agama
Guru
Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.
 
Agama's Avatar
 
Posts: 776
Karma: 2751519
Join Date: Jul 2010
Location: UK
Device: PW2, Nexus7
Quote:
Originally Posted by JSWolf View Post
This is the cleaned up code...

Code:
body {
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0;
}
margin-top and margin-bottom can be better in the @page declaration rather than in body.

The difference is subtle but significant:

If set in body then margins only apply to the top and bottom of the text file being rendered, (typically a chapter), and NOT to the screen of the device. This means that if the text is longer than one screenful on the device, (and a chapter usually is), then you'll lose top margin as you forward through the chapter and the bottom margin will only show once the end of the chapter is displayed.

So if you want the vertical margins to persist as you scroll/page through a chapter then use @page for top/bottom.

(I think that this may also be why calibre uses @page in this way on conversions.)
Agama is offline   Reply With Quote
Old 04-01-2013, 04:12 PM   #9
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,645
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by Agama View Post
margin-top and margin-bottom can be better in the @page declaration rather than in body.

The difference is subtle but significant:

If set in body then margins only apply to the top and bottom of the text file being rendered, (typically a chapter), and NOT to the screen of the device. This means that if the text is longer than one screenful on the device, (and a chapter usually is), then you'll lose top margin as you forward through the chapter and the bottom margin will only show once the end of the chapter is displayed.

So if you want the vertical margins to persist as you scroll/page through a chapter then use @page for top/bottom.

(I think that this may also be why calibre uses @page in this way on conversions.)
That's very much incorrect. Putting the margins in the body will work for all of the XML files in the ePub. So if I was to set the top & bottom to 5em, it would be that way throughout every XML as long as they were not overridden.

True that you can just use @page. But you also want the actual margins set to 0 in body in that case.
JSWolf is offline   Reply With Quote
Old 04-02-2013, 03:27 AM   #10
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: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
Actually, he is right. The margin in the body only works for the beginning and end of the HTML file. If a HTML file is paginated, which it its usually is, the margin is not inherited on the other pages, but only on the first for the top margin and on the last page for the bottom margin.
Toxaris is offline   Reply With Quote
Old 04-02-2013, 08:41 AM   #11
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: 7,514
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by JSWolf View Post
That's very much incorrect. Putting the margins in the body will work for all of the XML files in the ePub. So if I was to set the top & bottom to 5em, it would be that way throughout every XML as long as they were not overridden.
Sure, for each XHTML file, but not for each screen/page in them. Since the flow is defined to go vertically (i.e., next and previous pages are virtually above and below the current screen), left and right margins in <body> work as expected, and are valid for all the pages. But once one puts top and bottom margins in @page (where they belong), why not put left and right too (where, it can be argued, they belong as well) and leave the <body> with plain "margin: 0; padding: 0"?
Jellby is offline   Reply With Quote
Old 04-02-2013, 02:58 PM   #12
Agama
Guru
Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.Agama ought to be getting tired of karma fortunes by now.
 
Agama's Avatar
 
Posts: 776
Karma: 2751519
Join Date: Jul 2010
Location: UK
Device: PW2, Nexus7
Quote:
Originally Posted by Toxaris View Post
Actually, he is right.
Quote:
Originally Posted by Jellby View Post
Sure, for each XHTML file, but not for each screen/page in them. Since the flow is defined to go vertically (i.e., next and previous pages are virtually above and below the current screen), left and right margins in <body> work as expected, and are valid for all the pages. But once one puts top and bottom margins in @page (where they belong), why not put left and right too (where, it can be argued, they belong as well) and leave the <body> with plain "margin: 0; padding: 0"?

Thank-you. I know it's correct because I fell foul of it in practise. I think that JSWolf misunderstood me, perhaps because it's hard to explain clearly. It's easier to understand the difference when you see it happening!

I should have said:

If set in body then margins only apply to the top and bottom of each XHTML file being rendered, (typically a chapter), and NOT to the screen of the device.

So, top/bottom margins defined in body css are only seen when the top or bottom of an XHTML document is visible. Solution: define them in @page.


I would agree that all these margins should be in @page with one exception. Old readers like my PRS-300 display horrible ADE page numbers down the right margin. Using margin-right in @page causes these numbers to appear further left, (which is more obtrusive), whereas in body it does not - it just margins the page text. So specifying in body gives a way of stopping these numbers from overlapping text. There is no option in the firmware to switch them off, but I have read that subsequent Sony readers do not have them.

Last edited by Agama; 04-02-2013 at 03:09 PM.
Agama is offline   Reply With Quote
Old 04-02-2013, 10:21 PM   #13
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,645
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by Agama View Post
I would agree that all these margins should be in @page with one exception. Old readers like my PRS-300 display horrible ADE page numbers down the right margin. Using margin-right in @page causes these numbers to appear further left, (which is more obtrusive), whereas in body it does not - it just margins the page text. So specifying in body gives a way of stopping these numbers from overlapping text. There is no option in the firmware to switch them off, but I have read that subsequent Sony readers do not have them.
The 700 was the first Sony without page numbers on the right side of the screen. Next it was in all the x50 line on forward.
JSWolf is offline   Reply With Quote
Old 04-05-2013, 07:08 AM   #14
Jeff L
Zealot
Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.Jeff L ought to be getting tired of karma fortunes by now.
 
Posts: 117
Karma: 584308
Join Date: Oct 2010
Location: San Francisco
Device: Kindle
Quote:
Originally Posted by Agama View Post
Old readers like my PRS-300 display horrible ADE page numbers down the right margin. Using margin-right in @page causes these numbers to appear further left, (which is more obtrusive), whereas in body it does not...
From what I understand, the ADE page numbers occur outside the body but inside the @page. So you need to leave enough of a gap between whatever you set for body and @page to fit the page numbers.

I use this:

@page { margin-right: 0em}
body { margin-right: 16pt}

It leaves enough space for 3 digit page numbers. Perhaps a smidgen more would be needed for 1,000+ pages.
Jeff L is offline   Reply With Quote
Old 04-05-2013, 10:41 AM   #15
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,645
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
If you are concerned about the page numbers on the right side of the screen for older Readers using an older ADE, don't use @page at all. Just set the left/right margins in body like so...

body {
margin-top: 5pt;
margin-bottom: 0;
margin-left: 5pt;
margin-right: 16pt
}

That is all you need. You do not need to set the left/right margins anyplace else except if you want larger margins in other places.
JSWolf 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
Hi every body 27gh32 Introduce Yourself 4 03-19-2012 09:50 AM
<body style=""> How to stop this? Danger Sigil 8 12-13-2010 08:17 PM
Mobi TOC style vs ePub style? phearlez Kindle Formats 3 04-11-2010 06:35 AM


All times are GMT -4. The time now is 08:30 AM.


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