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 04-02-2012, 05:27 AM   #1
Elle518
Junior Member
Elle518 began at the beginning.
 
Posts: 3
Karma: 10
Join Date: Apr 2012
Device: none
Create a space between some paragraphs

Hi everyone! I'm trying to figure it out how is the best/correct way to create spaces between some paragraphs.
I have different choices to make:

1st. Between .space { margin-top:2.5 em; }/.space { padding-top:2.5em; }

2nd. Between
Code:
<p>Text</p>
<p class="space">Text</p>
or
Code:
<p>Text</p>
<p class="space"></p>
<p>Text</p>
With this one I have the doubt if it's correct to leave code without any text between the tags.

or
Code:
<p>Text</p>
<p class="space">&nbsp;</p>
<p>Text</p>
Please, could you show me the best way to do it?
A lot of thanks!!!
Elle518 is offline   Reply With Quote
Old 04-02-2012, 09:13 AM   #2
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: 2,744
Karma: 2117255
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-300, PRS-T1
Depends. I use your first and you last solution. The middle one can be ignored by a reader. If it is a section break, I tend to use the last option. If it is for something else, I would probably use the first one.

Also, with your last option, you don't need the style 'space'. You just get an empty line.
Toxaris is online now   Reply With Quote
Old 04-02-2012, 11:58 AM   #3
Keroberos
Zealot
Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.Keroberos can program the VCR without an owner's manual.
 
Keroberos's Avatar
 
Posts: 127
Karma: 194002
Join Date: Aug 2009
Device: Kobo Mini (4GB), Nook Classic wi-fi, iPod Touch (Bluefire Reader)
I always use something like this,
Code:
.space{margin-top:2,5em;}

<p>Text</p>
<p class="space">More Text</p>
Unless it's a section break, then I use a small centered image with top and bottom margins because with reflowable text if the section break happens on a page break it is difficult to tell if it's a section break.
Keroberos is offline   Reply With Quote
Old 04-02-2012, 12:57 PM   #4
mmat1
Det
mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.
 
mmat1's Avatar
 
Posts: 913
Karma: 936586
Join Date: Jan 2012
Location: Zischebattem
Device: Acer Lumiread
Quote:
Originally Posted by Elle518 View Post
1st. Between .space { margin-top:2.5 em; }/.space { padding-top:2.5em; }
In a "common" paragraph, there isn't a visible difference between margin and padding. Both is valid.
If you use a border around the paragraph or some background-color, then there is a big difference.
mmat1 is offline   Reply With Quote
Old 04-04-2012, 01:34 PM   #5
uieluck
Enthusiast
uieluck began at the beginning.
 
uieluck's Avatar
 
Posts: 46
Karma: 10
Join Date: Jul 2010
Location: Denver, Colorado
Device: iphone, ipad, kindle, nook
If you're working in InDesign, you can make a style that has space below or above to provide white space between paragraphs.
uieluck is offline   Reply With Quote
Old 04-06-2012, 09:12 PM   #6
Tennyoelf
Junior Member
Tennyoelf began at the beginning.
 
Posts: 8
Karma: 10
Join Date: Apr 2012
Device: All
For some reason I use this -

p.breakinp
{
text-indent:20px;
margin-top:0;
margin-left: 0;
margin-right:0;
font-family:"Times New Roman", Times, serif;
font-size:12px;
margin-bottom: 2em;
}

- for my paragraphs that need space between them. However Kobo Vox (the native reader) does not read it. I have no idea why. I'm kind of lost because those spaces are really needed. None of my CSS margins are being read. Every other device reads it, just not the Kobo reader or the Kobo Vox or the other android reader. Is my CSS too primitive? Or is my code funky? I use both Sigil and Calibre.
Tennyoelf is offline   Reply With Quote
Old 04-06-2012, 11:22 PM   #7
pholy
Booklegger
pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.
 
pholy's Avatar
 
Posts: 1,780
Karma: 7974046
Join Date: Jun 2009
Location: Toronto, Ontario, Canada
Device: BeBook(1 & 2010), PEZ, PRS-505, Kobo BT, PRS-T1, Playbook, Kobo Touch
Slightly off-topic... Do you really want a font size of 12 PIXELS? That's pretty tiny on a 167 dpi screen like the Kobo. And I always do my text-indent in ems... I don't know if checking on an old Kobo would help you.
pholy is online now   Reply With Quote
Old 04-07-2012, 04:03 PM   #8
JSWolf
Suspended
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.
 
Posts: 35,392
Karma: 16147088
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Sony Reader PRS-650, iPad, nook STR
Quote:
Originally Posted by Tennyoelf View Post
For some reason I use this -

p.breakinp
{
text-indent:20px;
margin-top:0;
margin-left: 0;
margin-right:0;
font-family:"Times New Roman", Times, serif;
font-size:12px;
margin-bottom: 2em;
}

- for my paragraphs that need space between them. However Kobo Vox (the native reader) does not read it. I have no idea why. I'm kind of lost because those spaces are really needed. None of my CSS margins are being read. Every other device reads it, just not the Kobo reader or the Kobo Vox or the other android reader. Is my CSS too primitive? Or is my code funky? I use both Sigil and Calibre.
Not very good code overall...

Here is the same code fixed up....

Code:
.breakinp {
  text-indent: 0;
  margin-top: 30px;
  margin-right: 0;
  margin-left: 0;
  margin-bottom: 0
}
That's all you need. It does work with ADE. The code to use it would be...

Code:
<p class="breakinp">Your paragraph here.</p>

Last edited by JSWolf; 04-08-2012 at 06:38 PM.
JSWolf is offline   Reply With Quote
Old 04-08-2012, 12:18 AM   #9
yekim54
What the Dog Saw
yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.yekim54 ought to be getting tired of karma fortunes by now.
 
yekim54's Avatar
 
Posts: 303
Karma: 981684
Join Date: Jul 2008
Location: Dunn Loring
Device: Sony PRS-505, PRS-650, Asus TF101
Quote:
Originally Posted by JSWolf View Post
Not very good code overall...

Here is the same code fixed up....

Code:
.breakinp {
  text-indent: 0
  margin-top: 30px;
  margin-right: 0;
  margin-left: 0;
  margin-bottom: 0
}
That's all you need. It does work with ADE.
Did you test it with ADE? It's missing a ";" after "text-indent: 0".
yekim54 is offline   Reply With Quote
Old 04-08-2012, 06:06 PM   #10
pholy
Booklegger
pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.pholy ought to be getting tired of karma fortunes by now.
 
pholy's Avatar
 
Posts: 1,780
Karma: 7974046
Join Date: Jun 2009
Location: Toronto, Ontario, Canada
Device: BeBook(1 & 2010), PEZ, PRS-505, Kobo BT, PRS-T1, Playbook, Kobo Touch
I'm still not comfortable with using pixels for any measurement in an epub. The dpi for various screens goes from 100 (or less) for some lcd screens usp to 200 for a 5 inch E-Ink screen, and maybe more for a Retina display. The visual effect will be quite unpleasant.

And I would use margin: 0.5em, 0, 0; or margin 0.5em, 0, 0, 0; remembering that margins start aat the top and go around clockwise. A two valued margin doesn't do waht you want, and I always forget that it is the side margins that are duplicated with the three valued margin.

@yekim54 - You know he didn't try exactly what he typed with ADE ADE would have thrown out his whole style sheet for that missing semicolon
pholy is online now   Reply With Quote
Old 04-08-2012, 06:38 PM   #11
JSWolf
Suspended
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.
 
Posts: 35,392
Karma: 16147088
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Sony Reader PRS-650, iPad, nook STR
Quote:
Originally Posted by yekim54 View Post
Did you test it with ADE? It's missing a ";" after "text-indent: 0".
OOPPSS!

It was a typo. It's been fixed.
JSWolf is offline   Reply With Quote
Old 04-08-2012, 06:44 PM   #12
JSWolf
Suspended
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.
 
Posts: 35,392
Karma: 16147088
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Sony Reader PRS-650, iPad, nook STR
For those that like ems instead of my 30px, here is the code....

Code:
.breakinp {
  text-indent: 0;
  margin-top: 2em;
  margin-right: 0;
  margin-left: 0;
  margin-bottom: 0
}

Last edited by JSWolf; 04-08-2012 at 06:47 PM.
JSWolf is offline   Reply With Quote
Old 04-09-2012, 04:18 AM   #13
mmat1
Det
mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.mmat1 ought to be getting tired of karma fortunes by now.
 
mmat1's Avatar
 
Posts: 913
Karma: 936586
Join Date: Jan 2012
Location: Zischebattem
Device: Acer Lumiread
Quote:
Originally Posted by pholy View Post
And I would use margin: 0.5em, 0, 0; or margin 0.5em, 0, 0, 0;
with kommas between the values ?
mmat1 is offline   Reply With Quote
Old 04-09-2012, 01:12 PM   #14
Tennyoelf
Junior Member
Tennyoelf began at the beginning.
 
Posts: 8
Karma: 10
Join Date: Apr 2012
Device: All
Quote:
Originally Posted by JSWolf View Post
Not very good code overall...

Here is the same code fixed up....

Code:
.breakinp {
  text-indent: 0;
  margin-top: 30px;
  margin-right: 0;
  margin-left: 0;
  margin-bottom: 0
}
That's all you need. It does work with ADE. The code to use it would be...

Code:
<p class="breakinp">Your paragraph here.</p>
I'm just getting back into coding after years away, so I figured my code was messy. Thanks for the input. I do need indents for the paragraph though, would that be a class element for the body?

And I'm curious why you picked margins at the top instead of the bottom, is there a reason for that?

Thanks again!
Tennyoelf is offline   Reply With Quote
Old 04-09-2012, 08:53 PM   #15
theducks
Grand Sorcerer
theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.theducks ought to be getting tired of karma fortunes by now.
 
theducks's Avatar
 
Posts: 13,609
Karma: 5126946
Join Date: Aug 2009
Location: The (original) Silicon Valley, USA
Device: Galaxy Tab 2, Astak Pocket Pro, K4NT
Quote:
Originally Posted by Tennyoelf View Post
I'm just getting back into coding after years away, so I figured my code was messy. Thanks for the input. I do need indents for the paragraph though, would that be a class element for the body?

And I'm curious why you picked margins at the top instead of the bottom, is there a reason for that?

Thanks again!
I have been using balanced top/bottom margins for <P> tags

No bottom means that the last line ends at the Hard Bottom (without any bottom white space. That might just make a difference on some pages.
theducks 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
space between paragraphs gatorman Sigil 3 01-07-2011 10:17 AM
Ragged right / space between paragraphs Oldpilot Sigil 5 11-11-2010 07:59 PM
Is there any way to remove space between paragraphs? kabloooie Calibre 6 11-03-2010 08:32 AM
Can't get calibre to *not* put space between paragraphs lunixer Calibre 8 09-11-2010 10:23 PM
Unwanted space between paragraphs superanima Calibre 3 10-14-2009 02:28 PM


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


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