Blockquotes and the infamous <p> tags...

John Gruber gruber at
Wed Mar 10 16:09:10 EST 2004

Rob Hulson <rob at> wrote on 03/10/04 at 2:37p:

> Hey, I just installed the beta of Markup and SmartyPants 1.5 in my 
> MovableType blog. Lovin' it so far.

Super. Glad you dig it.

> It's my understanding that if you put (with double spaces at the end of 
> the first line):
>  >Text to quote
> More text to quote.
> This results in:
> <blockquote><p>Text to quote<br />
> More text to quote.</p></blockquote>


> This is well and fine... unless your stylesheet has a border for 
> blockquotes. Because any text enclosed in a blockquote is also prefaced 
> by a <p> tag, the resulting look is as if there were a <br /> at the 
> beginning and end of the text, which results in the top and bottom 
> borders of the text being a line above and below, while the left and 
> right borders hug the text.

The problem is that you're only getting away with that because you're using XHTML 1.0 Transitional. In XHTML 1.0 Strict, you can't do this:


The <p> tags -- or some other block-level element -- are required.
The semantic idea is that you can't blockquote *text*; you've got to
blockquote a tag or tags.

Markdown only generates strict output, either XHTML 1.x or HTML 4.

> So far, I've not found any text format plugin ever get this one right. 
> Any clues how this might be solved, or what I might put in my 
> stylesheet to make this look decent?

Something like this should work:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    <html xmlns="" xml:lang="en" lang="en">
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <title>Tight margins in blockquotes</title>
    <style type="text/css">
    blockquote {
        border: 1px solid gray;
    p {
        border: 1px dotted gray;
    blockquote p {
        margin-bottom: 0;
    blockquote p:first-child {
        margin-top: 0;

The idea is that you turn off the bottom margin for all <p> tags
inside <blockquote>. Then you turn off the top margin for the first
element in a <blockquote>, if it's a <p>.

You still get space between paragraphs in a blockquote, because the
remaining paragraphs still have top-margins.

Hope this helps,

John Gruber          |              Daring Fireball
gruber at    |

More information about the Markdown-discuss mailing list