SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Addict
    Join Date
    Mar 2001
    Posts
    379
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    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

  2. #2
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    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.

  3. #3
    SitePoint Addict
    Join Date
    Mar 2001
    Posts
    379
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  4. #4
    Non-Member
    Join Date
    Jun 2010
    Location
    4727′35″N 2618′0″E
    Posts
    1,789
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First off, there is no need to make a
    Code:
    <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.

  5. #5
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    I had JS disabled that might explain why I got different results in Firefox to others.

  6. #6
    Non-Member
    Join Date
    Jun 2010
    Location
    4727′35″N 2618′0″E
    Posts
    1,789
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •