This question exists because it has historical significance, but it is not considered a good, on-topic question for this site, so please do not use it as evidence that you can ask similar questions here. This question and its answers are frozen and cannot be changed. More info: help center.

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
If this question can be reworded to fit the rules in the help center, please edit the question.

If multiple classes had conflicting properties (e.g. if .red and .GoldBg both specified the color property) then the CSS specificity rules apply; the order of classes in the class="..." attribute shouldn't matter.
–
ideOct 18 '10 at 0:23

4

Be aware IE6 doesn't support multiple classes and will only apply the last one - GoldBg in this instance.
–
ajcwNov 3 '10 at 16:10

3

but try to avoid naming classes like '.red' if you can. One day the client will want all the red text to be blue and now you've confused every developer that has to touch that code going forward.
–
DA.Mar 15 '11 at 6:29

Rather than have 20 images for all your site buttons and logos (and therefore 20 http requests with the latency around each one) you just use one image, and position it each time so only the bit you want is visible.

You can also use spriting for javascript controlled animations. Just cycle through the sprites on a setInterval etc.
–
Matthew LockDec 3 '09 at 6:14

1

Good suggestion from Matthew Lock - the bonus with that suggestion is that you just change the position of the image, rather than the source of the image - so pre-loading isn't necessary on your entire animation set.
–
Steve FentonDec 3 '09 at 8:03

Knew this one but pretty handy. Also don't forget if that isn't an option, you can use the overflow property without resorting to ugly clearing divs.
–
alexMar 9 '09 at 23:43

1

I don't know why everyone uses divs with a clear, i think br is a much more semantically relevant element to use, and I would consider a br with a clear on it to be less ugly then floating everything whether it needs it or not
–
Matt BriggsJan 4 '10 at 20:12

1

@Matt Using overflow: hidden is even more semantic I believe - why introduce an element that is only there to fix a layout?
–
alexMar 12 '11 at 3:32

You can transform using the proprietary IE "filter:" thing like you used to do for transparent PNGs. Though the IE transform/rotation parameters require some basic trigonometry calculations. And standard obnoxious "filter:" bugs still apply.
–
Jon AdamsJun 26 '10 at 4:28

1

Ahahaha, just rotated this text block! So much fun. Going to write a greasemonkey script to mess with people.
–
George MauerApr 14 '11 at 18:02

Not really a feature, but useful nonetheless: The child selector works in all browsers except IE6, allowing you to isolate IE6 without using hacks or conditional stylesheets or invalidating your code. Thus, the link in the following code will be red in IE6, blue in every other browser.

Beware, I discovered recently that the iPad (and presumably iPhones and iPods) do not support this, by which I mean it doesn't display the scrollbar and cuts off your content.
–
ajcwFeb 27 '11 at 17:39

4

iOS, or, more precisely, mobile Safari support this just fine. What they don't do, though, is show scroll bars. You have to two-finger scroll. So, not always intuitive. Not sure why apple made that decision.
–
DA.Mar 15 '11 at 6:32

@John iOS versions before 5 make you use two fingers to scroll overflow:scroll content, but you can use iScroll 4 to fix this. iOS 5, however, doesn't need that script and does it all natively. Ad@m
–
kirbAug 30 '11 at 11:21

@annakata: Are you sure? I just tried it quickly, and the absolute div was positioned inside it's parent - a fixed div. I added another absolute div with with the same specs but with no parent (well, body would be its default parent), and it was positioned differently than the one inside the fixed - i.e. it was positioned at the bottom of the page. So I assume absolute-inside-fixed works.
–
AgentConundrumAug 10 '10 at 12:00

The border-radius stuff is part of the CSS3 specification. As CSS3 is still not completely finished the more progressive browsers in the meantime implement parts of it with their own properties (-moz, -webkit). So we can already enjoy rounded corners, cleanly coded in pure css.

Unfortunately the other big player in the browser market still shows no sign of implementing css3 features.