Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > checkboxes

Reply
Thread Tools

checkboxes

 
 
'bonehead
Guest
Posts: n/a
 
      04-17-2004
Okay, here's a real nummnuts question:

Can I manipulate the placement of the checkbox's label relative to it's
name? IOW, what if I want the box to appear to the left of the label
instead of to the right?

 
Reply With Quote
 
 
 
 
Jukka K. Korpela
Guest
Posts: n/a
 
      04-17-2004
'bonehead <(E-Mail Removed)> wrote:

> Okay, here's a real nummnuts question:


No, it was just a pointless intro.

> Can I manipulate the placement of the checkbox's label relative to
> it's name?


Yes.

> IOW, what if I want the box to appear to the left of the
> label instead of to the right?


You have some odd meaning for "IOW".

The box normally appears to the left of the label, when you write
<input type="checkbox" ...> <label ...>...</label>

What is the problem with that?

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html


 
Reply With Quote
 
 
 
 
Tina - AffordableHOST.com
Guest
Posts: n/a
 
      04-17-2004
"'bonehead" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> Okay, here's a real nummnuts question:
>
> Can I manipulate the placement of the checkbox's label relative to it's
> name? IOW, what if I want the box to appear to the left of the label
> instead of to the right?



Yes, you just put the text to whatever side you want. The text that shows
up on the webpage isn't in the actual form code.

--Tina
--
http://www.AffordableHOST.com - since 1997
Managed, Dedicated and Colo Server Pkgs.
Cpanel hosting starting @ $5.95 a month
April Special: 15 months for the price of 12!


 
Reply With Quote
 
David Dorward
Guest
Posts: n/a
 
      04-17-2004
'bonehead wrote:

> Can I manipulate the placement of the checkbox's label relative to it's
> name? IOW, what if I want the box to appear to the left of the label
> instead of to the right?


Then you format the label in the usual way for HTML documents - you put it
after the checkbox.

<input type="checkbox" name="animal" value="Dog" id="chkAnimalDog">
<label for="chkAnimalDog">Dog</label> <br>

<input type="checkbox" name="animal" value="Cat" id="chkAnimalCat">
<label for="chkAnimalCat">Cat</label>

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
 
Reply With Quote
 
Toby A Inkster
Guest
Posts: n/a
 
      04-18-2004
David Dorward wrote:

> 'bonehead wrote:
>
>> Can I manipulate the placement of the checkbox's label relative to it's
>> name? IOW, what if I want the box to appear to the left of the label
>> instead of to the right?

>
> Then you format the label in the usual way for HTML documents - you put it
> after the checkbox.
>
> <input type="checkbox" name="animal" value="Dog" id="chkAnimalDog">
> <label for="chkAnimalDog">Dog</label> <br>
>
> <input type="checkbox" name="animal" value="Cat" id="chkAnimalCat">
> <label for="chkAnimalCat">Cat</label>


True, but this raises an interesting question. Which side is better?

Aesthetically,

[x] an option
[x] another option

looks nice. Everything lined up. But, for a one-dimensional output medium,
such as a screen reader, it makes more sense to have the labels *before*
the input:

an option [x]
another option [x]

However, it may be possible to have your cake and eat it too. Untested:

<div class="checkboxwrapper">
<label for="foo">Foo</label>
<input type="checkbox" name="foo" id="foo">
</div>
<div class="checkboxwrapper">
<label for="bar">Bar</label>
<input type="checkbox" name="bar" id="bar">
</div>

.checkboxwrapper {
position: relative;
}
.checkboxwrapper label {
padding-left: 24px;
}
.checkboxwrapper input {
position: absolute;
top: 0; left: 0;
}

As a side note, for those using labels with an implicit "for", e.g.

<label>Foo <input name="foo"></label>

You may quite like this CSS:

label {
border: 1px dotted white;
}
label:hover {
color: black;
background: #ff9;
border: 1px dotted black;
}

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

 
Reply With Quote
 
David Dorward
Guest
Posts: n/a
 
      04-18-2004
Toby A Inkster wrote:

> True, but this raises an interesting question. Which side is better?
>
> Aesthetically,
> [x] an option
> [x] another option
> looks nice.


And is also consistant with the majority of GUI interfaces, which is good
for usability.

> Everything lined up. But, for a one-dimensional output medium,
> such as a screen reader, it makes more sense to have the labels *before*
> the input:
>
> an option [x]
> another option [x]


That is why we have <label> elements, to explicitly associate the controls.
I don't know what the support is like, but the data format certainly can
cope.

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      04-18-2004
Toby A Inkster <(E-Mail Removed)> wrote:

> Aesthetically,
>
> [x] an option
> [x] another option
>
> looks nice. Everything lined up. But, for a one-dimensional output
> medium, such as a screen reader, it makes more sense to have the
> labels *before* the input


It has already become the web-wide "standard" to put the checkbox (or
radio button) before the label. It is now irrelevant whether this was bad
practice; even if it were, it has already become good practice by
becoming so universal. If screen readers have problems with it, they need
to adapt to the "standard", and as far as I know, they have done that.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Checkboxes with Repeaters and DataGrids Fresh Air Rider ASP .Net 0 03-05-2004 10:12 PM
Huge number of checkboxes to be populated from database Mike Lerch ASP .Net 3 08-06-2003 01:31 PM
Datagrids with checkboxes and postbacks... Gavin ASP .Net 2 07-30-2003 09:29 AM
ASP.NET Checkboxes Tracey ASP .Net 0 07-23-2003 05:01 PM
ViewState Problem with CheckBoxes in a DataGrid kannadasan ASP .Net 1 06-25-2003 06:43 AM



Advertisments