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 05-06-2013, 12:09 AM   #1
rhino79
Member
rhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheeserhino79 can extract oil from cheese
 
Posts: 16
Karma: 1210
Join Date: Apr 2013
Device: Nexus 7
Question: paragraph spacing and CSS styles

Let's say I have a block quote with three paragraphs. The desired result would have a bit of space above the first paragraph and a bit of space after the last paragraph, and the entire block will be indented right.

My question is this: what is the standard way of achieving this... styling each paragraph or wrapping the paragraphs in a div and styling the div? With paragraphs, its necessary to have a style for the first paragraph (space above), the middle (no spacing) and the last paragraph (space below). This is rather tedious. The alternative would be to place the paragraphs in a div and style the div with space on top and bottom.

What's the "correct" way to do this?
rhino79 is offline   Reply With Quote
Old 05-06-2013, 12:48 AM   #2
Tex2002ans
Fanatic
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: 509
Karma: 392101
Join Date: Jul 2012
Device: Nook
You could use a specific div if you wanted, or you could use a blockquote tag:

http://www.w3schools.com/tags/tag_blockquote.asp

Code:
<blockquote>
<p>Paragraph one.</p>
<p>Paragraph two.</p>
<p>Paragraph three.</p>
</blockquote>
You can then have the CSS applied to blockquote classes. You could then leave the blockquote design up to the specific device, or you could apply CSS along the lines of:

Code:
blockquote {
    margin-left: 5%;
    margin-right: 0;
}
Tex2002ans is offline   Reply With Quote
 
Enthusiast
Old 05-06-2013, 12:42 PM   #3
Turtle91
Guru
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: 669
Karma: 3807234
Join Date: Dec 2012
Location: Shannon, Ireland today
Device: iPhone 5/iPad 1&2/Surface Pro/Kindle PW
+1 Tex

You can also use the CSS to style the paragraphs within the blockquote/div:

blockquote p {text-indent:0; font-size:1.2em; fant-family:script}

...or whatever you want. You can style with classes too:

blockquote.script p {}
blockquote.terminal p {}
blockquote.song p {}
blockquote.verse p {}

Etc.
Turtle91 is offline   Reply With Quote
Old 05-06-2013, 05:06 PM   #4
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: 37,705
Karma: 18475502
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Sony Reader PRS-650, iPad, nook STR
Here is the best solution for a blockquote...

Code:
blockquote {
margin-top: 1em;
margin-bottom: 1em;
margin-left: 2em;
margin-right: 2em
}
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
Paragraph spacing Banks ePub 2 08-09-2012 05:24 PM
Preference: Paragraph indent or a little paragraph spacing? 1611mac General Discussions 48 11-11-2011 12:43 AM
Nook Paragraph Spacing poppies ePub 3 04-21-2011 12:01 AM
Paragraph spacing jhempel24 Calibre 5 08-24-2010 12:14 AM


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


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