xy.css

About

What, Why, When, Who, & How

What? This website is all about responsive, grid-based design. Here is a general overview of the site:

Why? Because I enjoy designing on the grid, and wanted to bring together all of the greatest design techniques:

When? I first got into web design back in 2000, started doing responsive design in 2009, then grid-based design in 2010, and then finally brought it all together with xy.css in 2011. Now in 2012, I have refined the application of these techniques and streamlined the process of grid-based design with xy.css — a lightweight and extensible CSS framework for responsive, liquid-matrix design.

Who? Jeff Starr is a professional developer, designer, author, and publisher with over 10 years of experience with WordPress. His books include Digging into WordPress, .htaccess made easy, The Tao of WordPress, and WordPress Themes In Depth. Jeff also writes tutorials on WordPress, web development, security, and much more at Perishable Press, DigWP.com, and WP Mix.

How to use the site..

  • Upper-left corner – displays the current browser width
  • Upper-right corner – buttons for showing/hiding the grid
  • Lower-left corner – displays the current @media rules
  • Upper-right corner – “Top” button

To view the vertical grid, click the “show matrix” button. To see the horizontal grid, resize the browser width to 984px and click the “layout grid” button.

Visit Tools to implement any of these techniques on your own web pages.

Show support, check out my books:

Digging Into WordPress .htaccess made easy The Tao of WordPress WordPress Themes In Depth

..and Premium WordPress plugins:

The Ultimate Front-End Form Solution Umlimited Ajax-Powered Signup Forms