(_8(0) DOH! CSS Gotchas!

HTML & CSS
1

Earlier today at work I lost nearly 2 hours scratching my head wondering why I couldn’t get an element’s width right using standard padding / float tricks. I finally found the problem, a forgotten min-width call was being inherited from the ruleset meant for tablets. Easy enough to fix (min-width: 0; to override) but the min-width call wasn’t being called out on Firebug which is why I didn’t spot it quicker. :\

What made it especially fun was the fact I built out a testcase version of the sheet and couldn’t replicate the bug (because I didn’t test the other screen modes).

So, anyone want to share their own multi hour layout problems that, once found, led to a moment of “Doh!” ?

2

Not nearly as complicated as that, but today I spent a good hour trying to figure out why half the tags in the tag cloud on my blog were disappearing into the Nirvana.
I spent ages playing with word-wrap and white-space, but to no avail.
Turns out that I had somehow changed display:inline-block into display:block without noticing.
Doh!