I can do what? CSS properties that change your designs forever

This is a thread to review the CSS properties that, once discovered, change the very way pages get set up. One of mine is background-size. Once this became widespread I stopped using various image tricks to make sure the background would look fine in the corner.

Multi-backgrounds are certainly a close second, and transitions are a third.

I think the next big one for me will be CSS-grid. I’ve done experiments with it so far and it’s promising, but not widespread enough to depend on yet.


Yes the above are good :slight_smile:

My favourite all time addition was border radius as that saves hours and hours.

Display:table is coming in handy and I’d be lost without :before and :after.

I’m looking forward to positioned floats and flexbox as I could do with them today for the layout a client has asked for today.

  1. Border radius ( this should be everyone’s first choice… if only by sheer volume me of use);
  2. box-shadow
  3. :before/:after () it’s quite handy, and underrated)
  4. TIE: display:inline block/display:table
  5. TIE: Multiple BGs/ Gradients. If this were more widely supported it would be #3

wish list:
6) text-shadow … it could have been #2 , but for IE
7) Flex box…or whatever they are calling it this time around… seriously tho. I have been experimenting with COMPLETELY different “versions” of this since 2008. I dont think it’s ever coming, let alone becoming standard

Those are all great examples, but the reason I left box radius off is that it didn’t fundamentally change how I was laying things out - it just got rid of a rather painful workaround involving wrapper divs. Flex / CSS grid promises to do that. IE 10 will be supporting it first with Mozilla and webkit close behind so it looks like its going to happen this time. Certainly is unusal for MS to take the lead on something.

Yes I think we could see something happening at last.:slight_smile:

It’s been a long wait and it really annoys me that they have overlooked some of the basic layout techniques that we need in favour of more esoteric things that we can live without or do by other means.

Indeed, or special effects. Being able to control a form’s layout is a lot more important to everyday functionality than animations, in my opinion.