05-06-2013, 12:09 AM | #1 |
Member
Posts: 18
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? |
05-06-2013, 12:48 AM | #2 |
Wizard
Posts: 2,297
Karma: 12126329
Join Date: Jul 2012
Device: Kobo Forma, 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> Code:
blockquote { margin-left: 5%; margin-right: 0; } |
Advert | |
|
05-06-2013, 12:42 PM | #3 |
A Hairy Wizard
Posts: 3,095
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
|
+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. |
05-06-2013, 05:06 PM | #4 |
Resident Curmudgeon
Posts: 73,987
Karma: 128903378
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Here is the best solution for a blockquote...
Code:
blockquote { margin-top: 1em; margin-bottom: 1em; margin-left: 2em; margin-right: 2em } |
|
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 |