Full Width Textareas
Working with textarea widths can be painful if you want the textarea to span 100% width. Why painful? Because if the textarea's containing element has padding, your
"width:100%" textarea will likely stretch outside of the parent container -- a frustrating prospect to say the least. Luckily there's a quick CSS solution to this problem!
box-sizing to the rescue!
border-box allows the textarea to respect its parent container's padding and border, recalculating what
100% actually means. If the
content-box, the textarea would continue to stretch outside the parent container as it would have before.
I was inspired when I first saw Addy Osmani's original ShineTime blog post. The hover sheen effect is simple but awesome. When I started my blog redesign, I really wanted to use a sheen effect with my logo. Using two HTML elements and...
Tabular data can oftentimes be boring, but it doesn't need to look that way! With a small MooTools class, I can make tabular data extremely easy to read by implementing "zebra" tables -- tables with alternating row background colors.
The above CSS is extremely basic.
Counters. They were a staple of the Geocities / early web scene that many of us "older" developers grew up with; a feature then, the butt of web jokes now. CSS has implemented its own type of counter, one more sane and straight-forward than the ole...