My CSS Stops my form buttons working?

[mediaman_12]

First a note that this problem has 'eveloved' from here (it now looks more like a general CSS problem, than just a Firefox PR1 & the validation script issue. So this forum now seams more suitable)

Somehow the css I have on my form pages has stoped the buttons at the bottom working in all browsers except IE. If I disable the css in Firefox (using the Web Developer plugin) the buttons work fine. I have tried removing the "formbutton" class from the buttons (it makes them all a uniform size) with no change, I also removed the class form the css, which also did nothing.

Anyone had this problem before, and have any tips on how to sort it out?

Page / CSS

[CyberAlien]

Possible error: in your .js file function form1_validator doesn't return true at the end of function.

[Paul O'B]

Hi,

You can't click your form buttons because they are under your footer.

Your footer is 68px highand absolutely placed but your clearfooter is only 27px therefore you have considerable overlap.

Either change the clear footer and footer heights etc or reset the z-index as follows.

#content-box {
 width: 531px;
 text-align: left;
 float: left;
 padding: 7px 0 0 0;
 position:relative;
 z-index:100;
}

#footer {
  position:absolute;
  bottom:0;
  width:100%;
  height: 68px;
  z-index:0;
}

That should put the submit buttons on top and make them clickable.

Paul

[mediaman_12]

Doh!
Huge thanks.