Quicksand: Awesome jQuery plugin to filter/animate HTML lists. some more cool demos in this video.

Uniform – Sexy forms with jQuery. form element replacements with a couple themes. not bad.

jb.tumblr. now that’s a cool html trick. dude also has two cool tumblr designs. via ram.

Daring Fireball: PastryKit. seems apple has a demo website that uses javascript/css to do fixed-position content in the iphone browser (previously thought to be impossible) and change the default scroll-speed to make it work more like a native app. very interesting.

Typekit. hosted css font-face solution. that’s pretty damn cool.

High Performance Web Sites :: SpriteMe makes spriting easy. it’s a bookmarklet that suggests and generates a sprite image and css for any given page. that’s pretty impressive.

Sample Resume Template | A Free HTML Resume Template by thingsthatarebrown.com. a very nice html resume.

Mozilla Webdev: Cross-Browser Inline-Block. it might seems simple but it’s one of those things you might kill yourself over trying to make it work in a dozen different browsers.

Fluid 960 Grid System. that’s pretty well done. via ram

DebugBar – IE extension for web developer. basically firebug for IE.

Most used CSS tricks | StylizedWeb.com. a list of useful css tricks.

nice html forms

“html makes it so easy to write forms that look like crap”
- Jamis Buck of 37signals

For some reason I’ve been thinking about that idea a lot this weekend. The 37signals post which made this comment pointed out Wufoo, a site that let’s you create nice looking html forms for collecting all sorts of user information. The site is also a testament to usability and just looks damn nice (see some screenshots here). None the less, it’s still not what I, as a programmer, needs as it’s a hosted solution for non-tech people. I could really use a Wufoo that spits out some rails templates (preferably in haml) which I can just slap into my project. I find myself making html forms far too often, repeating way too much work, and spending too much time on css details. I need something clean, cross browser compliant, and preferably with some client side validation.

Wuhoo actually provides a good start with this. Their templates page (which has some great color palettes) actually gives you a static form with some standard items (like radio items, date boxes, address boxes, etc) along with css and javascript to make it look quite nice. There’s still work to be done if to hook it into your project, but it’s a start. I also came across this post which shows how to use css to do all sorts of horizontal and vertical layouts from a plain html form. I feel like mixing these two things together and adding some jquery form validators (and convert it to haml) could be pretty handy.

Seems the kind of thing I’d do if I was consulting full time (or maybe the kind of thing I’d do starting around June).

CSS Step Menu. nice trick for making a step/wizard display with css.

Facebook TextboxList with Autocompletion. that’s a pretty good trick of having the input box inside a fake input box.

CSS Reference. nice searchable reference with cross-browser support info.

Css Trick – Pure Css Text Gradients. that’s a slick trick using png transparencies.

CSS Text Wrapper. wrap text in any shape. really well done. check out the examples.

Maniacal Rage. hadn’t been to this site in a while and i like the new tumblr style theme. runs on simplelog as well.

IE and italics problem

Seems Internet Explorer 6 is just out to screw me whenever possible. I just realized that all the posts I did recently which included album covers weren’t aligning properly IE6. So I assumed the images where the problem and after a horrible amount of edit-and-check cycles I realized that the problem was actually related to the italic text in the paragraphs. IE, for some stupid reason, won’t overflow italicized text properly so the width of the containing “p” or “div” is too wide. Luckily a quick search on google turned up a great summary of the IE and italics problem. I tried using the fix they suggested but I couldn’t get it to work. So what did I do? I turned off italics for “em” tags within IE6 or below (using this conditional comment trick) . So, if you like italics you should use firefox (or safari) or upgrade to IE7.

FAVEUP – Design Inspiration Gallery. logos, business cards, and websites.