Popup appears under flash file

If your popup (e.g. menu) appears under a flash file in FireFox, try wmode=”transparent” for the embed (or as a param for object), and I think the bgcolor attribute does make the difference too.

Gotcha: Why position:fixed header scroll?

Look at http://mix08.com and you can see the header was not scrolling because it has position:fixed in its CSS class. We tried to do something similar but the header keep scrolling. The html is very simple, too simple to have anything wrong, so we couldn't tell what's the problem with it.

All we were missing, was this - the DOCTYPE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

After we discovered it of course I did say "Of course!" (not "Eureka!"). But when we were writing HTML in notepad, the simplest thing is always what we would have forgotten.

I tell you, life is full of small annoying stupid problems like this one.

Absolute positioned div and dropdown box

An old bug has been fixed in IE 7. It's always working as expected in FireFox but as I can remember it wasn't drawing it out nicely (it is now, in 2.0.0.6).

See the code below:

<div id="DivA" style="position:absolute; width:200px; height:200px; background-color:Green; display:block; z-index:100;">I am a div</div> <select name="DropDownList1" id="DropDownList1"> <option value="Item1">Item1</option> <option value="Item2">Item2</option> <option value="Item3">Item3</option> <option value="Item4">Item4</option> </select>

In IE 6 showing a div in absolute position on top of / overlapping a select (drop down box) would always fail. The select box will ALWAYS be on top of everything except one - the iFrame. Therefore we need an iframe with exactly the same size draw beneath the div in order to hide the select box completely. In IE7 this trick is no longer required. :)