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 06-13-2014, 04:55 AM   #1
Leonatus
Guru
Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.Leonatus ought to be getting tired of karma fortunes by now.
 
Leonatus's Avatar
 
Posts: 780
Karma: 8296716
Join Date: Mar 2013
Location: Berlin, Germany
Device: Kobo Touch
CSS: margin-top and margin

At formatting the <p> in the css of an epub in Sigil, I wished to create a certain distance between single paragraphs. Thus, I added
margin-top: 2em;

O.k. it worked. Only that I found that 2em is a little too much. So I changed the margin-top to 1em, and, surprise: nothing changed, though trying several times. The space between the paragraphs could not be manipulated anymore.

Then, I looked in other epubs; in one of them, I found, instead of margin-top, simply:
margin: 1 0;

I adapted this to my ebook, and, hoops, the margin changed. Could somebody, please, explain to me what has happened, and what has been my mistake?
Leonatus is offline   Reply With Quote
Old 06-13-2014, 07:49 AM   #2
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
You apparently set it to px, by leaving off a unit. It looks like you changed the left and right margin as well.

Look here:
http://www.w3schools.com/css/css_margin.asp
mrmikel is offline   Reply With Quote
Advert
Old 06-13-2014, 10:31 AM   #3
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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by Leonatus View Post
At formatting the <p> in the css of an epub in Sigil, I wished to create a certain distance between single paragraphs. Thus, I added
margin-top: 2em;

O.k. it worked. Only that I found that 2em is a little too much. So I changed the margin-top to 1em, and, surprise: nothing changed, though trying several times. The space between the paragraphs could not be manipulated anymore.

Then, I looked in other epubs; in one of them, I found, instead of margin-top, simply:
margin: 1 0;

I adapted this to my ebook, and, hoops, the margin changed. Could somebody, please, explain to me what has happened, and what has been my mistake?
What I've seen used in some ePub is the following CSS code...

Code:
p {
margin-top: .3em;
margin-bottom: .3em
}
1em is still too large. Anything above .3em is too large (IMHO).

But personally, I'd change the .3em to 0 so there's no paragraph spaces. I'm not a fan of them.
JSWolf is offline   Reply With Quote
Old 06-13-2014, 10:34 AM   #4
odedta
Addict
odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.
 
Posts: 398
Karma: 96448
Join Date: Dec 2013
Device: iPad
Doesn't seem to be the error in what he did actually.

The margin property can be used in a number of ways:
1. set 1 value which will mean you set a specific value for all sides.
Quote:
margin:0;
2. set 4 values. values go: top right bottom left (clockwise)
Quote:
margin: 0 0 0 0;
3. set 2 values. values go: top and the rest.
Quote:
margin: 0 0;
It's the lazy way of having to type margin-top, margin-right, margin-left and margin-bottom and i'm glad they made that.

In any case, you have to apply both margin-top and margin-bottom to get the margins between paragraphs you want or you can just use line-height but I found that worked less efficiently on some books so stick to margins.
odedta is offline   Reply With Quote
Old 06-13-2014, 10:37 AM   #5
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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
I'm not. I find the lazy margin harder to read. It's easier to have all four margins separate because it is easier to read at a quick glance.
JSWolf is offline   Reply With Quote
Advert
Old 06-13-2014, 12:41 PM   #6
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,216
Karma: 11044355
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by odedta View Post
3. set 2 values. values go: top and the rest.
Nope. It's top-and-bottom and left-and-right.
Jellby is offline   Reply With Quote
Old 06-13-2014, 12:54 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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
From http://www.w3schools.com/css/css_margin.asp

Code:
margin: 25px 50px 75px 100px;

    top margin is 25px
    right margin is 50px
    bottom margin is 75px
    left margin is 100px
JSWolf is offline   Reply With Quote
Old 06-13-2014, 02:19 PM   #8
odedta
Addict
odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.
 
Posts: 398
Karma: 96448
Join Date: Dec 2013
Device: iPad
Quote:
Originally Posted by Jellby View Post
Nope. It's top-and-bottom and left-and-right.
Yep, if you follow the clockwise sense then you get:
Quote:
The margin property can have from one to four values.

margin: 25px 50px 75px 100px;
top margin is 25px
right margin is 50px
bottom margin is 75px
left margin is 100px

margin: 25px 50px 75px;
top margin is 25px
right and left margins are 50px
bottom margin is 75px

margin: 25px 50px;
top and bottom margins are 25px
right and left margins are 50px

margin: 25px;
all four margins are 25px
odedta is offline   Reply With Quote
Old 06-13-2014, 02:36 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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
This is just so much easier to read...

Code:
.margins {
margin-top: 20px;
margin-bottom: 50px;
margin-left: 75px;
margin-right: 100px
}
JSWolf is offline   Reply With Quote
Old 06-13-2014, 04:01 PM   #10
odedta
Addict
odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.odedta read the news today, oh boy.
 
Posts: 398
Karma: 96448
Join Date: Dec 2013
Device: iPad
Quote:
Originally Posted by JSWolf View Post
This is just so much easier to read...

Code:
.margins {
margin-top: 20px;
margin-bottom: 50px;
margin-left: 75px;
margin-right: 100px
}
lol, there is no point in arguing about it, do what ever you like
odedta is offline   Reply With Quote
Old 06-13-2014, 04:12 PM   #11
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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by odedta View Post
lol, there is no point in arguing about it, do what ever you like
I'm not arguing. Besides, it's not an argument when I'm right.

As you can see, Jellby got it incorrect. But with the long form margins, there's no way to get it incorrect.
JSWolf is offline   Reply With Quote
Old 06-14-2014, 02:48 AM   #12
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,216
Karma: 11044355
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by JSWolf View Post
As you can see, Jellby got it incorrect. But with the long form margins, there's no way to get it incorrect.
I don't think I got it incorrect, I meant that with two values the first is for the vertical margins and the second for the horizontal ones.

On the other hand, it's much simpler to write "{margin:1em}" than detailing all four margins. I use different forms depending on what I want.
Jellby is offline   Reply With Quote
Old 06-14-2014, 10:39 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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
I'll still be writing margins separately. It's just easier to me. I don't have to remember all the different permutations. Besides, in most cases, I don't need more then two margins.
JSWolf is offline   Reply With Quote
Old 06-15-2014, 06:11 AM   #14
Tex2002ans
Wizard
Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.
 
Posts: 1,613
Karma: 7401109
Join Date: Jul 2012
Device: Kobo Forma, Nook
Quote:
Originally Posted by JSWolf View Post
I'll still be writing margins separately. It's just easier to me. I don't have to remember all the different permutations.
I agree, my personal preference is leaning towards long form being much easier to read.

Also, there is that ol' Nook Touch (?) bug that some users ran across because they were using the short-hand form of margin.

Last edited by Tex2002ans; 06-15-2014 at 06:13 AM.
Tex2002ans is offline   Reply With Quote
Old 06-15-2014, 05:22 PM   #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: 58,549
Karma: 53778670
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
I've not seen any nook bug with the short form for margins. But, I've not read that much on my nook STR.
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
Aura HD How to modify the top margin? scoky Kobo Developer's Corner 4 04-20-2014 02:10 PM
CSS margin instead of margin-top, etc. icallaci Conversion 24 10-19-2013 09:52 AM
@page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; } cybmole Conversion 15 02-12-2011 11:57 AM
Top Margin in epub penguintri ePub 8 05-08-2010 08:37 PM
calibre ignore margin-top and margin-bottom bender Calibre 2 12-11-2009 06:58 AM


All times are GMT -4. The time now is 03:12 AM.


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