CSS Issue on Form

Hello, on my form at Tweet My Home | TweetMyHome the submit button is causing issues, or rather the check box above it. The check box itself checks, but will not allow the submit button to activate. It only activates the submit button if you click on the text to the right of the submit button.

This appears to happen in Firefox and Chrome.

Is this a css issue? Any help would be appreciated.

Thanks,

Jon

I don’t seem to get the problem but your ‘Please fill the required field.’ Messages are hidden in the bottom of the large text input boxes.

What browser did you try? I’ve tried with Chrome and Firefox on three different computer and connections, same issue. If you click only directly in the check box. Do not click on the text to the right of it. It will not allow submit.

First off, there is no need to make a

<div id="myCheckbox0" class="checkboxArea"></div>

Add the checkbox.gif as the background for the label. Sure, that means changind the mark up you have there, but if it’s possible, it’s the best option.

Secondly, it’s a JS problem. And the fact that you rely on the div above to tell you if the check box was checked. Which means two things: if no JS no visual style for your check box, and the wrong handle on the wrong type of element for an event in a form.

Look at what happens (or rather at what doesn’t hapen) when View->Page Style->No Style, in FF, for example. Click on label (the class for div changes), click on check box (the class for div doesn’t change).

All in all it’s the wrong style (with JS) and the wrong approach.

I had JS disabled that might explain why I got different results in Firefox to others.

Yes, I have NoScript, and I also didn’t saw it first.

I can understand using JS to enhance form elements, but for something like select elements in Google translate.

Using it here, when the label for the element is more than enough, and putting a class on a div to check the value for a form element, not good.