testing: blockquotes
May 24th, 2008 by erb
So while working on updating my blog, with lots and lots of new info (currently in draft form) … as well as updating my blog resume … I was unhappy with the way the <blockquote> looked on that resume page. Result: a couple hours distraction researching, editing, and fine tuning several better WordPress blockquotes for future use… Comments? Readability? Suggestions? All greatly appreciated!
TESTING:
Say, I’m also using this post to try out the ins and del tags, and CSS mods. So without further ado, this is ins text, and
What about using q quote with cite?
This is a blockquote.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque accumsan tempus ipsum. Etiam blandit augue sed tortor. Integer urna. Nullam leo pede, molestie non, vulputate vel, tempor ac, nunc. Maecenas condimentum hendrerit lectus. Maecenas at lacus. Etiam at diam. Nunc ultricies eros vitae nibh.
Sed luctus nulla a mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec venenatis, nisl at aliquam convallis, lacus sem egestas sem, in sagittis metus lectus pharetra augue. Vivamus consectetuer pharetra elit. Praesent ut pede vel eros tincidunt placerat. Nam consectetuer scelerisque nibh. Nullam dictum nisl dignissim ipsum. Ut laoreet tempus odio. Fusce sed metus. Mauris convallis hendrerit leo. Proin euismod sapien ac tortor. Ut blandit dui at urna. Vivamus commodo suscipit nunc. Praesent eu felis id massa consequat aliquam. Proin ac lectus nec quam convallis hendrerit.
This is a magazine quote. Proin ultricies, neque sed porta sollicitudin, lacus nulla placerat eros, at semper ante elit non lectus. Etiam leo nibh, viverra nec, interdum vel, molestie sed, enim.
Fusce suscipit aliquet nunc. Nunc metus magna, fermentum cursus, elementum et, fringilla nec, magna. In pretium. Nunc ornare porttitor mi. Donec adipiscing, dui in varius sodales, neque augue aliquet lectus, nec elementum ante augue quis nisi. Proin convallis pulvinar justo. Duis odio lectus, aliquam sed, fringilla vel, ultricies eleifend, magna. Etiam vel pede. Curabitur lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec convallis, mauris vel aliquet interdum, arcu odio iaculis tellus, quis lacinia orci quam nec lorem. Vivamus orci nunc, pretium non, mollis vitae, luctus a, massa. Proin magna sapien, lobortis vitae, dictum in, hendrerit sed, orci. Nulla sit amet nulla sit amet ligula sodales volutpat. Donec feugiat nisi et velit. Integer nec augue sit amet nisi tempus aliquet. Ut sit amet mi et nibh lacinia aliquam. Nunc vel mi sit amet pede porttitor tincidunt. Quisque ac dolor ornare nisl ullamcorper interdum. Proin sit amet nisi.
This is a blockquote alt1.
Vestibulum sed nunc. Sed quis nunc id nibh blandit gravida. In vehicula, enim vel sodales auctor, justo massa egestas turpis, non rhoncus libero purus et ante. Nam iaculis justo vel metus. Maecenas nunc turpis, rhoncus at, blandit ac, fringilla nec, lorem. Nam fringilla risus vitae arcu. Phasellus felis enim, iaculis ac, blandit sodales, venenatis vitae, mauris.
—Anon
Vivamus orci enim, accumsan a, bibendum nec, dictum a, nibh. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut mattis pellentesque erat. Nam malesuada tincidunt mi. Proin condimentum pharetra diam. Vestibulum eleifend dui et enim. Pellentesque convallis. Morbi rutrum consectetuer lacus. Maecenas ac mi. Maecenas consequat ipsum quis nisi. Fusce consectetuer dictum purus. Vivamus bibendum dolor eget risus. Cras eget lacus. Duis tortor. Cras pulvinar ligula non risus. Donec posuere purus non justo. Ut interdum, tellus id congue commodo, nulla velit gravida arcu, a porta quam orci ut odio. Vivamus dignissim.
This is a blockquote alt2small.
Mauris sollicitudin dui a diam. Vivamus porttitor tellus scelerisque nisl. Fusce dignissim ligula ut nulla. Vestibulum ornare. Praesent congue, nulla id dapibus porttitor, nisi metus tristique odio, ut venenatis ligula dui vel purus. Phasellus vitae ligula eu ipsum placerat porta.
—Anon
Sed nisl mi, varius a, feugiat quis, blandit eget, odio. Sed aliquam, arcu in consequat aliquet, turpis quam blandit risus, porta facilisis augue nibh ut ipsum. Aenean elit. Sed convallis adipiscing elit. Donec vulputate est at diam. Donec congue volutpat nibh. Sed aliquam, quam id consequat pharetra, urna orci pharetra tortor, nec interdum sapien nisl sed est. Ut tempus mi ut leo. Suspendisse et nunc. Etiam eros nibh, pretium ut, fringilla in, tempus at, diam. Mauris elit tortor, rhoncus a, egestas quis, vulputate placerat, mauris.
This is a blockquote alt2large.
Ut dapibus, felis sed porta vestibulum, massa sem sodales dui, a pulvinar mi mauris vitae nisi. Quisque consectetuer vulputate lacus. Donec tincidunt mollis turpis. Praesent at ante.
—Anon
Maecenas auctor leo a neque. Quisque vestibulum lacus a ipsum. Integer ut odio. Mauris sed tortor. Vivamus a metus ut sem facilisis bibendum. Fusce in enim ut lorem cursus vulputate. Vestibulum dolor leo, vulputate id, mattis et, scelerisque eget, nisl. Quisque bibendum, lorem eget viverra semper, lacus orci varius mauris, eget elementum quam nisi ut est. Curabitur luctus. Nam pharetra. Maecenas dictum. Curabitur consectetuer convallis sapien. In malesuada. Praesent turpis sapien, vestibulum quis, ullamcorper ac, luctus et, urna. Curabitur ultrices pulvinar purus. Etiam auctor, mi luctus molestie sollicitudin, sapien lorem tempor turpis, eget ullamcorper nunc ligula sit amet ante. Praesent metus. Vestibulum facilisis convallis nisi. Maecenas congue dolor ut turpis.
erb
wrote on 05/25/08 at 1:13 am :
Oh! I am Remiss! I should have left some pointers to sites I found Most Useful and Helpful (not to mention where I blatantly ripped off code).
Simple Double Quotes, from WebDesignerWall. This was the basis for my alt2 (both small and large). Nice site. I need to go back and look over the rest of this site later.
How to have a stylish blockquote as in Magazines?, from WordPress Rocks!. This was where I got magazinequote (I only changed the colors and width, and tweaked my padding).
The quote annotations (”Anon” above) are common/generic, and I just tweaked all the variants to work — taking advantage of em relative sizing instead of absolutes.
erb
wrote on 06/8/08 at 6:28 pm :
I noted that while these look fine (double-quoted, both topleft and bottomright) in Mac OS-X Safari — not so good in Firefox. The top left “open” quote is not appearing, and it appears this is due to breaking the XHTML rules a bit… Oh well!