</style> </head> <body> <form action=""> <ul> <li> <label for="shippingInfoBox"> My billing address is the same as my shipping address. <input type="checkbox" value="address" id="shippingInfoBox" /> </label> </li> <li> <label for="agreeToTerms"> YES, I have read and agree to Terms of Use </label> <input type="checkbox" checked="checked" value="agree" name="agreeToTerms" id="agreeToTerms" /> </li> </ul> </form> <!--########## 1. In Firefox, although my first input checkbox is "checked", it is not checked when the page loads. 2. In Firefox, the 2 checkboxes are next to each other, instead of one below the other.

Keeping labels confined to labels solves the problem, but that means the text next to the checkbox is not clickable. --> </body> </html>

Validates and functions. Click on the text, and check or uncheck the box at will. If you want a 'visual cue', then try something like: