Question

I created a select box using HTML and styled it using css:

#footer {
 padding-bottom:60px;
 position:absolute;
}

This disables the select box and makes it unclickable. But if I remove the “position:absolute” the select box works fine but it screws up my positioning. Does anyone have a solution for this?

EDIT: it works find when position:relative is used, but it’s unclickable when position is fixed or absolute. I used for the HTML part.

Answer 1

These kind of issues almost always result from another element overlapping the textbox. To resolve the problem I usually use the inspector tool in firebug. When you click the text box it will select the invisible element instead which will give you a much better picture of what is happening.

That being said the usual fix is setting a higher z index as Simon pointed out.