nobr

[Jeff]

I have a series of radio buttons with a "label" to the right. I don't
want the label to break from the radio button when the line wraps and I
want each label/button pair to take the same space.

Something like this comes to mind:

nobr{width: 8em}

<nobr><input type="radio" ...> $5.00</nobr>
Seems to me that nobr never made it into and html specs, or am I wrong?

Also, is it OK to specify widths, horizontal margins and padding for
inline elements?

Better way?

this also comes to mind:
<span><input type="radio" ...>&nbsp;$5.00 </span>

Jeff

[Steve Pugh]

Jeff <do*********@al l.uk> wrote:

I have a series of radio buttons with a "label" to the right. I don't
want the label to break from the radio button when the line wraps and I
want each label/button pair to take the same space.

Something like this comes to mind:

nobr{width: 8em}

<nobr><input type="radio" ...> $5.00</nobr>
Seems to me that nobr never made it into and html specs, or am I wrong?

Also, is it OK to specify widths, horizontal margins and padding for
inline elements?

Better way?

this also comes to mind:
<span><input type="radio" ...>&nbsp;$5.00 </span>

How about <label> ? It was designed for the purpose of markin up form
control labels. Seems to be exactly what you're doing.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net > <http://steve.pugh.net/>

[Jukka K. Korpela]

Steve Pugh wrote:

How about <label> ? It was designed for the purpose of markin up form
control labels. Seems to be exactly what you're doing.

It's useful for other purposes, but it doesn't prevent line breaks.

For a set of radio buttons, the structured way is something like

<fieldset>
<legend>Selec t the amount of donation</legend>
<div><input id="a1" type="radio" ...> <label for="a1">$5.00</label></div>
<div><input id="a2" type="radio" ...> <label for="a2">$6.00</label></div>
<div><input id="a3" type="radio" ...> <label for="a3">$7.00</label></div>
</fieldset>

Then you can set
fieldset { white-space: nowrap; }

It would suffice to use &nbsp; instead of a space, but in a general
case, the label text could contain several spaces, making this
impractical, or hyphens, making this insufficient.

As regards to making the fields fit into, say, 8em, the best approach is
to avoid creating such problems. Put a form on a page of its own where
it can occupy the entire available width.

[Jim Moe]

Jeff wrote:

I have a series of radio buttons with a "label" to the right. I don't
want the label to break from the radio button when the line wraps and I
want each label/button pair to take the same space.

Something like this comes to mind:

nobr{width: 8em}

This makes no sense. <nobr> is a directive to prevent line wrapping. It
has no dimensions, just as <br> or <em> has no dimensions.
As others have mentioned, a <fieldset> and <label>s look like what you
should be using.

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

[dwight.stegall]

nobr will not validate. use CSS white-space:nowrap;