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-23-2013, 09:37 AM   #1
NASCARaddicted
Addict
NASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and grace
 
Posts: 312
Karma: 43106
Join Date: Apr 2009
Location: Germany
Device: BeBook One, Pocketbook Touch
Display block ... why? (Question about CSS and Calibre)

Hello

I hope someone can explain this to me.

I created an xhtml File, together with a css file. I used normal "p" tags.

After that, I converted it into an epub, with Calibre. Then I looked at the finished epub file and notices, that it changed some of my css. What surprised me most is: On all p-tags in my css, Calibre added "display: block". Same goes for the headings and div tags.

Why? Is there a good explaination, why I should use display:block on epub files? Is this related to Widows and Orphans (I hope you know what I mean) or is there another good reason why I should use it?



Thanks in advance for your help.
NASCARaddicted is offline   Reply With Quote
Old 06-23-2013, 10:27 AM   #2
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 496
Karma: 318998
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by NASCARaddicted View Post
Hello

I hope someone can explain this to me.

I created an xhtml File, together with a css file. I used normal "p" tags.

After that, I converted it into an epub, with Calibre. Then I looked at the finished epub file and notices, that it changed some of my css. What surprised me most is: On all p-tags in my css, Calibre added "display: block". Same goes for the headings and div tags.

Why? Is there a good explaination, why I should use display:block on epub files? Is this related to Widows and Orphans (I hope you know what I mean) or is there another good reason why I should use it?

Thanks in advance for your help.
First at all, don't use Calibre to build your epub book, instead, use SIGIL; Sigil will respect your styles.

http://www.mobileread.com/forums/forumdisplay.php?f=203

http://web.sigil.googlecode.com/git/...with_epub.html

Regarding the "display: block" property added to your <p> tags that doen't matter; maybe you don't know it but <p> tags, by default, by omission, has the property "display: block". To write it (or not to write it) is the same for <p> tags.

Regards
Rubén
RbnJrg is offline   Reply With Quote
 
Advertisement
Old 06-23-2013, 11:17 AM   #3
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,086
Karma: 1444487
Join Date: Apr 2008
Location: Central Oregon Coast
Device: PRS-300
As I understand it display block forces it to occupy the width of the page and is normally displayed with blank lines before and after.

As was pointed out, this is unnecessary and if not removed, would keep you from making any special changes in the text for quotes or other special formatting.

This sort of thing is why it is best to simply bring your html into Sigil and edit it there. Sigil does not change your text unless you ask it to, or unless you activate HTML Tidy, which is generally not recommended.

Sigil will allow you put any change you want and facilitates the process by using "clips" which allow you to insert commonly used tags, words, etc of your choice.

If you have an xhtml file, you can open it in Sigil, then add additional file for your stylesheet. You need to do one more step, rightclick on the xhmtl file(s) and choose to link them to the stylesheet. This step is necessary in case you want to use more than one stylesheet for the various files. (one for poetry sections, another for plain text, or another for dialog sections.

Unless your work is quite short, you probably should keep sections under about 250k or so. This allows your epub to work in older readers and speeds rendering in new ones. Press control and enter at the end of each chapter and that will generally create reasonable size sections that work well.
mrmikel is offline   Reply With Quote
Old 06-23-2013, 11:41 AM   #4
SBT
Fanatic
SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.
 
SBT's Avatar
 
Posts: 531
Karma: 594538
Join Date: Sep 2010
Location: Norway
Device: prs-t1, tablet, Nook Simple, assorted kindles
Lately I've been wondering why I should use <p> instead of <div>?
Sometimes it's pretty annoying not to be able to nest block-type elements within <p>-tags.
SBT is offline   Reply With Quote
Old 06-23-2013, 12:04 PM   #5
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: 15,283
Karma: 6022733
Join Date: Aug 2009
Location: (The original) Silicon Valley, USA
Device: Galaxy Tab 2, Astak Pocket Pro, K4NT
Quote:
Originally Posted by SBT View Post
Lately I've been wondering why I should use <p> instead of <div>?
Sometimes it's pretty annoying not to be able to nest block-type elements within <p>-tags.
Looking at appendix D of theCSS2 (typical Defaults for HTML4...)
<div has none, no defaults
IMHO dive is a simple (box) container that can be customized

As with package shipping, use the best container designed for the article being shipped/displayed.
There is a whole section in CSS2 devoted to 'Block' (9: Visual formatting Model) [most which goes over my head ], but as I get it; controls how all the boxes are stacked together within the Cascade
theducks is online now   Reply With Quote
Old 06-23-2013, 12:31 PM   #6
SBT
Fanatic
SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.
 
SBT's Avatar
 
Posts: 531
Karma: 594538
Join Date: Sep 2010
Location: Norway
Device: prs-t1, tablet, Nook Simple, assorted kindles
<p> has a default top and bottom margin, <div> does not.
Both are block-display elements, but <p> only permits embedding inline-display elements. You can partially work around this by redefining the display property from inline to block for e.g. <span> elements, but it feels a bit icky...
The only downside I can see is by replacing <p> with <div> is that paragraphs are not separated by a blank space in readers that do not support CSS.
SBT is offline   Reply With Quote
Old 06-23-2013, 03:09 PM   #7
NASCARaddicted
Addict
NASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and graceNASCARaddicted herds cats with both ease and grace
 
Posts: 312
Karma: 43106
Join Date: Apr 2009
Location: Germany
Device: BeBook One, Pocketbook Touch
Thanks so far for all your replies.

Quote:
Originally Posted by RbnJrg View Post
First at all, don't use Calibre to build your epub book, instead, use SIGIL; Sigil will respect your styles.
Yeah, I got away from Calibre a few months ago, because it changed my css file (like the added display:block stuff). I also tried Sigil, but I decided I will do EVERYTHING on my own, meaning: I am only using Notepad ++ ... well, not 100%. I also use a small program that splits the xhtml file in smaller parts (based on chapters) and a small program to pack the files to epub. But I do all the stuff like content.opf and toc.ncx just with Notepad ++. I know it is tedious, but therefore I know everything is 100% the way I want. And it makes it easier to change some things, if I have to. Oh, but just in case, you are thinking about possible errors while editing the epub files: I use an epub checker, to make sure that the epub is valid.

The thing why I mentioned Calibre is: of course, I unpacked some of the Calibre epubs and looked at the different files, to learn some things. That's how I discovered the display: block stuff. I wasn't sure, if I can get an advantage from it or not - but I guess, I can keep my css like it is right now (without the display: block)

Thanks again.
NASCARaddicted is offline   Reply With Quote
Old 06-23-2013, 10:26 PM   #8
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: 38,629
Karma: 19637653
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, Sony PRS-650, Sony PRS-T1, nook STR, iPad 1, iPhone 5
Quote:
Originally Posted by SBT View Post
<p> has a default top and bottom margin, <div> does not.
Both are block-display elements, but <p> only permits embedding inline-display elements. You can partially work around this by redefining the display property from inline to block for e.g. <span> elements, but it feels a bit icky...
The only downside I can see is by replacing <p> with <div> is that paragraphs are not separated by a blank space in readers that do not support CSS.
There is yet other downsides to replacing <p> with <div>. Reading the code looking just for those places where you actually want/need a <div> is harder. Also, to do the paragraph styles for most paragraphs, you'd have to do <div class="style"> where you can just do a <p> and define what <p> is. In ePub (via ADE), this makes the page numbers more accurate not using <div> where not wanted/needed.
JSWolf is online now   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
Display simple math expressions with CSS phossler Sigil 16 06-16-2013 09:30 PM
css question ralphiedee Sigil 74 12-23-2012 07:29 AM
CSS Question jackibar Sigil 24 03-01-2012 10:12 AM
Does mobi support display: inline-block; DeniseL Kindle Formats 2 09-30-2011 08:33 PM
CSS Question AppleTard Calibre 1 06-12-2011 01:07 AM


All times are GMT -4. The time now is 09:01 PM.


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