A Single Article

Read it, comment, and share it with your friends

Blueprint CSS Cheat Sheet

Posted November 12 in Design.

People were asking about a cheat sheet for Blueprint… a reference page with all the important class names that you can print out and keep on your desk. Fortunately, Alejandro Vasquez of digitart.net posted one to the mailing list over the weekend, and just in time! Here’s the direct link to the PDF: Blueprint CSS Cheat Sheet [PDF]. Join the BP Google group to keep up with news about Blueprint!

Blueprint CSS Cheat Sheet

Meta

Useful things

Related Articles

These just might ring a bell

Get a Trackback link

8 Trackbacks/Pingbacks

Other blogs referencing this article
  1. Pingback: Bram.us » Blueprint CSS Cheatsheet on November 12, 2007
  2. Pingback: Nachlese Oktober 2007 - Die Seiten des Monats | Nachlese | Dr. Web Weblog on November 13, 2007
  3. Pingback: Best Of October 2007 | Best of the Month | Smashing Magazine on November 13, 2007
  4. Pingback: Best Of October 2007 | Blog on November 13, 2007
  5. Pingback: { Studio Rhoad } Media Design & Photography» Blog Archive » Best Of October 2007 on November 13, 2007
  6. Pingback: ??? » Smashing Magazine 2007?10??? on November 18, 2007
  7. Pingback: i say that » Blog Archive » Best Of October 2007 on December 13, 2007
  8. Pingback: » CSS Collection 2008 CSS Concept: CSS can be just that easy.. on May 25, 2008

12 Comments

Responses to my article
  1. Adam Vandenberg November 12, 2007

    The “Basic Setup” block uses smart quotes instead of straight quotes in the HTML. This doesn’t matter so much when working off a print-out (as opposed to a copy-and-paste example), but might be worth fixing for the .1 release.

    -Nitpicker.

  2. Christian Montoya November 12, 2007

    Adam, thanks for catching that, I’ll forward it on to the person who made it.

  3. Anonymous coward November 13, 2007

    If blueprint was good and simple, we didn’t need a cheatsheet.
    These class names just don’t work if you haven’t written them.
    If you can’t write your own css “library”, forget it and get back to Dreamweaver.

  4. Christian Montoya November 13, 2007

    Ac: Please read the following post: Semantify

  5. r00t November 14, 2007

    thanks for the cheatsheet…

  6. Jeff Croft November 15, 2007

    Nice, Christian! Thanks! :)

  7. karthick November 27, 2007

    Hey!
    Great Stuff Christian, thanks for this! I have it printed.

  8. snoopy February 19, 2008

    nice!

  9. Volo Mike May 9, 2008

    I see how to do columns. How do I do row spacers with Blueprint? For now, I’m doing just a div start and end tag with a non-breaking space inside and no class assignment.

  10. Christian Montoya May 10, 2008

    Volo: I’m not sure what you mean by row spacers…

  11. kj July 31, 2008

    He means using divs as spacers which is bad practice… how would you suggest using blueprint and creating gaps between spans both horizontally and vertically.

  12. Christian Montoya July 31, 2008

    I wouldn’t suggest relying on Blueprint for that… if you need to apply various spacing to your rows, you would give each one an ID and in your custom CSS, apply margins to those rows. If you want every container to have some extra spacing, then you can just modify the “container” class in your custom CSS.

Leave a comment

Share your thoughts with the world

You can use Markdown, or you can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

Please keep comments respectful and on topic.

This form is guarded by Akismet, so don't waste your time trying to submit spam. It won't work. Ever.





Stay on top of new updates at this site: Subscribe to the Feed!