Quick CSS for better looking pull quotes
I decided that I wanted to be one of the cool kids that could do daringfireball.net style quick pull quote + commentary posts.
Problem: My custom theme’s CSS just left pull quotes looking like plain indented text… blah, blargh, barf.
I don’t pretend to be a designer today, but I want things I make to minimize eye-bleeding whenever possible.
I gave myself a timebox of 15 minutes to find a workable solution and here are the fruits of that labor:
Solution:
blockquote {
margin-top: 25px;
margin-bottom: 25px;
margin-left: 50px;
padding-left: 15px;
border-left: 3px solid #ccc;
}
Example:
Things can be really fun, if you let them be.
- Me (just now, boom!)
Next steps:
Learn more from css-tricks and go nuts with different classes for different uses on different parts of your site. Have fun!
Read other posts