Grid Designer 2 If you're familiar with the grid, a bit of design and basic typography, using this script should be pretty easy - most of the functions are pretty self-explanatory. If you're unfamiliar with grids in general, you could start by reading an excellent series of articles by web designer Mark Boulton. For those who want a real understanding of the theory of grids in relation to design and typography, I strongly recommend this book.
rgba.php test page Want to use RGBA in your projects but a solid color fallback for Internet Explorer 8- (and other old browsers) is just not good enough? Do you find that creating fallback semi-transparent pngs is too time-consuming? With rgba.php you get to use RGBA backgrounds in every browser with just one extra CSS declaration! All you need to use it is a server supporting PHP.
Media Queries for Standard Devices If you think responsive's simple, I feel bad for you son. We got 99 viewports, but the iPhone's just one. —Josh Brewer, March 10, 2010 A major component of responsive design is creating the right experience for the right device. Style Master CSS Editor for Windows and Mac OS X Cool Tools and Toys for Web Developers John, the lead developer (ok, pretty much the only developer) of Style Master is an avowed hacker. He loves exploring and experimenting with the latest features in browsers. Here's a collection of tools for web developers he's put together to help you analyse and debug your sites (and other people's sites as well), play with CSS3 features (bleeding edge browsers recommended) and more. XRAY works in Safari, Firefox and Internet Explorer.
HTML and CSS Table Border Style Wizard Compatibility Notes If you are using Internet Explorer 6, you should be able to use this wizard with only minor limitations. This page does not work with Opera 8 or IE 5 on Mac. Internet Explorer 6 does not support the border-spacing CSS2 table property. It also does not support any Netscape-specific CSS properties that are prefixed with -moz, and has limited support for the cursor property. This means you will not see all the effects in this wizard unless you use a browser like Firefox. css3 menu,animation navigation menu In this new category called “Tips and Tricks” we will introduce some quick and interesting methods around web development and web design. In today’s tip we’ll show you how to spice up your menu by adding a neat hover effect to it. The idea is to slide an image out to the right when hovering over a menu item.
Animatable: One property, two values, endless possiblities box-shadow From: 0 0 black To: 0 150px 10px -50px rgba(0,0,0,.5) Cutting Edge CSS3 Typography Techniques Beautiful typography always intrigues me and I'm always looking for ways to combine web typography and technology to make them display better. Last month I got a chance to experiment with CSS3 typography techniques and see how far I could mix and match these techniques to create a visually stunning piece of typography on the web. Today, I’ll show you how you can use these CSS3 properties to spice up your typography or create stunning text effects in a way you don’t think is possible. Note: These effects will only work on Webkit browsers but I have added fallbacks to make it viewable on other browsers.