Getting speechmarks to follow the quote

Question

I'm trying to get speechmarks to appear at the start and end of a quote.

Here's a link to the code (without images):

You can see the grey blocks (I've replaced the speechmark images with grey blocks in this case) I have at the start and end of the quote. The trouble is the closing quote sits on the right hand side.

I'd like the closing speechmark (or grey block) to sit straight after the quote. In this example it would come straight after '...expectation'

All help and tips appreciated!

Thanks in advance,

Tom Perkins

score 0 · Accepted Answer · answered May 23 '11 at 20:30

HTML

<h2>On all levels they exceed our expectation</h2>

CSS

h2:before {
content: "“";
}

h2:after {
content: "”";
}

Alternately, you can use images:

h2:before {
content: url(imgsrc);
}

h2:after {
content: url(imgsrc);
}

Highly simplified example: http://jsfiddle.net/cGDUc/14/

Getting speechmarks to follow the quote

1 Answers1