CSS

As designers, we are used to having quite a bit of control over how things are displayed in a browser. Sure, differing rendering engines don’t always agree on everything, but for the most part we can at least find ways to mitigate variance through workarounds, or by writing for the lowest common denominator. By far, one of the most frustrating parts of dealing with browser inconsistencies has got to be forms. There are two distinctively differing schools of thought regarding (not) styling form elements. For the longest time, we’ve had people on both sides of the proverbial fence, neither group..

The world's most advanced browser based Editor lets you experience a whole new way of editing. It’s faster than existing technologies and offers unprecedented functionalities.

Compass is a stylesheet authoring tool that uses the Sass stylesheet language to make your stylesheets smaller and your web site easier to maintain. Compass provides ports of the best of breed css frameworks that you can use without forcing you to use their presentational class names. It’s a new way of thinking about stylesheets that must be seen in action!

You can never have too much of a good thing–and two good things we rely on in our work are tips and tricks. Nuggets of information, presented clearly and succinctly, help us build solutions and learn best practices. In a previous article, we shared a jam-packed list of 250 quick web design tips. It seems only right to continue the trend by showcasing 100 fresh–and hopefully useful–CSS tips and tricks.

Ever got stuck with the annoying problem of aligning an image next to some text? We all did. There were times when align="absmiddle" would solve this immediately, but how would you accomplish this with CSS?

Float is a CSS positioning property. To understand its purpose and origin, we can look to print design. In a print layout, images may be set into the page such that text wraps around them as needed. This is commonly and appropriately called “text wrap”. Here is an example of that.

Cheat sheets are helpful to have around because they allow you to quickly remember code syntax and see related concepts visually. Additionally, they’re nice decorative pieces for your office. In this article, you’ll find 23 excellent, print-ready cheat sheets for HTML/HTML, CSS, and JavaScript (including MooTools and jQuery). So go ahead – print out your favorites and pepper your workspace with these wonderful references.

I am currently in the process of learning CSS (Cascading Style Sheets) based web design since it is now the standard foundation of layout for almost all web sites. I have read several books now and I still believe that I am slightly lost when it comes time to applying what I know from scratch. Over the past several months, I’ve been keeping a list for myself of potentially amazing tools and applications (most web based – all of them free) to make my CSS web design experience a snap. I purposely cut out over 30 options from this list, because these are the most user friendly and simplest to use..

About a year or two ago I wrote a quick demo on doing rounded corners in just CSS without using images, mostly as an exercise to see what's involved. Since then my knowledge of CSS has doubled, maybe even tripled - so here I'm going to present 'cleaner' versions of those methods. I did a second example just a month back, and after presenting it on several forums I was linked to other methods of doing this, and decided to condense the best of all techniques down to a single easy to deploy version.