Solved

Checkbox layout in CSS

Posted on 2009-05-07
4
471 Views
Last Modified: 2012-05-06
I'm trying to use checkboxes in a form layout using css. Does anyone have the css code and html for a css layout using checkboxes. My checkboxes are not lining up with the labels, and when I click on the labels it does not check the checkbox... even if I wrap the input tag with lable tag etc.
0
Comment
Question by:jasch2244
  • 2
4 Comments
 
LVL 12

Accepted Solution

by:
Tony van Schaik earned 500 total points
ID: 24328921
If you want to align the labeltext vertical use style="vertical-align:middle;width:32;height:32;"
More info here:
http://stackoverflow.com/questions/306252/how-to-align-checkboxes-and-their-labels-consistently-cross-browsers
http://www.xinotes.org/notes/topic/437/
 
 
0
 
LVL 20

Expert Comment

by:thehagman
ID: 24329077
Clicking on a label does not toggle the check box - that is by design: Clicking the label shall only *focus* an input element.
0
 
LVL 1

Author Comment

by:jasch2244
ID: 24329119
It appears that if you use a for in the lable tag or wrap the input tag with the lable tags that infact you can select / toggle the check box
0
 
LVL 1

Author Closing Comment

by:jasch2244
ID: 31579146
vertical-align on the input / checkbox seemed to fix the problem.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Inline input fields - Contact Form 7 5 27
How can I expand text with explaination 5 30
Open a div with click on an image 7 87
jQuery detect if it is a mobile device 3 90
"I want to put my photos online, but I don't want them stolen.  What settings should I use?" When You Put Photos Online First and foremost, any digital file published on the WWW can be copied, stored, modified, retransmitted, etc.  Remember Naps…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…

948 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now