Positioning issues with radio/check buttons in relation to their label

Please take a look at this page:

http://deimos.curious.be/~dusk/contact.php?action=show_booking

As you can see the radio/check buttons do not line up with their label.
It works with the input fields (like name/email), but only because I
gave those a width so that the label + input field fill the formset.
Obviously I don't want to specify a width for radio/check buttons,
because it looks silly on browsers applying that with. Any other ideas?

Tia
TomB

On 27 Aug 2006 07:00:50 -0700, "TomB" <tommy.bongaerts (AT) gmail (DOT) com> wrote:

Please take a look at this page:

http://deimos.curious.be/~dusk/contact.php?action=show_booking

As you can see the radio/check buttons do not line up with their label.
It works with the input fields (like name/email), but only because I
gave those a width so that the label + input field fill the formset.
Obviously I don't want to specify a width for radio/check buttons,
because it looks silly on browsers applying that with. Any other ideas?

Well, if I understand correctly what you are trying to do, I don't think
you need to be floating the labels. Just let them take their normal
place in the flow and put a <BR> after each checkbox / radio button.

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

Stephen Poley wrote:

Well, if I understand correctly what you are trying to do, I don't think
you need to be floating the labels. Just let them take their normal
place in the flow and put a <BR> after each checkbox / radio button.

The reason I use the float is to align the labels to the right. If I
just put <label><input><br><label><input><br> etc. there is no
alignment. I could get the desired effect easily with a table, but I
want it to work with just css.

Tommy

TomB wrote:

http://deimos.curious.be/~dusk/contact.php?action=show_booking

As you can see the radio/check buttons do not line up with their label.
It works with the input fields (like name/email), but only because I
gave those a width so that the label + input field fill the formset.
Obviously I don't want to specify a width for radio/check buttons,
because it looks silly on browsers applying that with. Any other ideas?

I've found no universal solution to form layout.

The <label><input> (or <input><label>) pair should be put in a <p>, and
the width for the <label> set as required for each form instance.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

TomB wrote:

Stephen Poley wrote:
Well, if I understand correctly what you are trying to do, I don't think
you need to be floating the labels. Just let them take their normal
place in the flow and put a <BR> after each checkbox / radio button.

The reason I use the float is to align the labels to the right. If I
just put <label><input><br><label><input><br> etc. there is no
alignment. I could get the desired effect easily with a table, but I
want it to work with just css.

I think I found the solution:
http://deimos.curious.be/~dusk/test.html

On 27 Aug 2006 09:20:39 -0700, "TomB" <tommy.bongaerts (AT) gmail (DOT) com> wrote:

Stephen Poley wrote:
Well, if I understand correctly what you are trying to do, I don't think
you need to be floating the labels. Just let them take their normal
place in the flow and put a <BR> after each checkbox / radio button.

The reason I use the float is to align the labels to the right. If I
just put <label><input><br><label><input><br> etc. there is no
alignment. I could get the desired effect easily with a table, but I
want it to work with just css.

Ah, OK. A table would probably be acceptable here, but does a
clear: left
on your labels do what you want?

You'll also need a clear on an extra element after the last checkbox to
make the containing border extend far enough down. (At least in IE).

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/