* { box-sizing: border-box } FTW by Paul Irish

One of my least favorite parts about layout with CSS is the relationship of width and padding. You’re busy defining widths to match your grid or general column proportions, then down the line you start to add in text, which necessitates defining padding for those boxes. And ‘lo and behold, you now are subtracting pixels from your original width so the box doesn’t expand.

* { box-sizing: border-box } FTW by Paul Irish

IE 6+7 box-sizing polyfill add-on

Related posts:

1. How to create slick effects with CSS3 box-shadow – RedTeamDesign
2. CSS Border Radius Generator
3. CSS3 Image Styles with jQuery

Feb 14, 2012      Posted under: CSS3

Leave a comment