Is there a simple way to pull off this style of quotes in HTML/CSS without having to resort to images or things like absolute positioning? It seems every time I look away something new and awesome is added to HTML/CSS, so I just wondered if this type of thing might be possible? :)

See image:

enter image description here

2 Answers 2


It is indeed possible without using images. One approach introduces additional markup besides a simple <blockquote> and another uses the :before and :after pseudo selectors to add the quotes. The quotes themselves are just blown up text and styled with CSS. So yes images aren't required, but they end up being easier to implement and more widely supported. The pseudo selectors don't have support in IE6 or IE7, but it's up to you if you want to support them.



You need the quote image, put it in the background of a div and set a first line margin.

You are going to need to use an image.

  • Thanks for your answer, but there's another quote on the end of the text, too. I should have included it in the image. May 9, 2011 at 17:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.