Using <fieldset>/<legend> without forms

[Ian Rastall]

I'm curious as to the group's feelings about using the <fieldset>
and <legend> tags around elements other than <form> elements ... I
wrote a small test file:
<http://www.learnsomethingnew.us/fieldset.html>
to illustrate this, and it validated at both the W3C and WDG sites.
(It's a <fieldset> around a <table> and <p>).

I'm able to view it on Opera 7.23, Mozilla 1.6, and IE 6. (Moz 1.6
renders it in Standards Compliance Mode as well.)

This interests me, because it seems like such a shame that we can't
use <fieldset> for anything we want, since it's so handy. Here's the
write-up in the HTML 4.01 spec: <http://tinyurl.com/2sbn4>. I don't
know how to read a DTD, but I don't see any mention of forms except
in commented sections.

Is it likely that HTML written along these lines will break in
future browsers? If not, is there any compelling reason not to use
<fieldset> in any way that validates?

Ian
--
http://www.aspipes.org/
http://www.bookstacks.org/
http://www.learnsomethingnew.us/

[Jukka K. Korpela]

Ian Rastall <id*******@sbcglobal.net> wrote:

I'm curious as to the group's feelings about using the <fieldset>
and <legend> tags around elements other than <form> elements ... - - Is it likely that HTML written along these lines will break in
future browsers?

Many people say that <fieldset> and <legend> are broken in _current_
browsers, not to mention old browsers that don't get them at all.

I think the main concern is user confusion. Form fields should look
like form fields, and other things shouldn't.

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

[Harlan Messinger]

"Jukka K. Korpela" <jk******@cs.tut.fi> wrote:

Ian Rastall <id*******@sbcglobal.net> wrote:

I'm curious as to the group's feelings about using the <fieldset>
and <legend> tags around elements other than <form> elements ... - -

Is it likely that HTML written along these lines will break in
future browsers?

Many people say that <fieldset> and <legend> are broken in _current_
browsers, not to mention old browsers that don't get them at all.

I'm curious what you mean by "broken". I've just used them for the
first time, and find them to look just as they ought to by default in
both IE6 and Mozilla, grouping controls and labeling them. Are they
meant to have some kind of function beyond that?
I think the main concern is user confusion. Form fields should look
like form fields, and other things shouldn't.

I'm guessing the OP is using form fields for some kind of client-side
application served over the web. Most users have no conception of what
an HTML form is or whether a given control is on one or not.
Semantically, if you're not submitting data for server-side
processing, shouldn't the controls be used without a <form>? But a
checkbox should still look to the user like a checkbox, and a button
like a button.
--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

[Bill Mason]

Ian Rastall wrote:

I'm curious as to the group's feelings about using the <fieldset>
and <legend> tags around elements other than <form> elements ... I
wrote a small test file:
<http://www.learnsomethingnew.us/fieldset.html>
to illustrate this, and it validated at both the W3C and WDG sites.
(It's a <fieldset> around a <table> and <p>).
If a fieldset contains no fields, is it a fieldset?
This interests me, because it seems like such a shame that we can't
use <fieldset> for anything we want, since it's so handy.
I don't see why it is so handy in your example. What is the purpose of
having it, besides the visual effect?
Is it likely that HTML written along these lines will break in
future browsers? If not, is there any compelling reason not to use
<fieldset> in any way that validates?

Semantics. A fieldset "allows authors to group thematically related
controls and labels". You are not using it to group any form
controls/labels at all.

It appears that the only use for it here is the default visual effect in
browsers, one that wouldn't be that hard to replicate with more
semantically accurate tags.

--
Bill Mason
Accessible Internet
http://www.accessibleinter.net/
prefix @accessibleinter.net with anything to reply

[Neal]

On Sun, 01 Feb 2004 23:52:50 -0500, Ian Rastall <id*******@sbcglobal.net>
wrote:

This interests me, because it seems like such a shame that we can't
use <fieldset> for anything we want, since it's so handy.

Yeah, and it's a shame we can't wrap the whole body in a <h1> tag since
that looks cool too. Plus it solves the readability issue.

[Ian Rastall]

On Wed, 04 Feb 2004 04:10:28 GMT, Bill Mason
<us****@accessibleinter.net> wrote:

I don't see why it is so handy in your example.
It wasn't meant to illustrate its usefullness ... just that it
rendered.
What is the purpose of having it, besides the visual effect?

It's just another way of grouping things together. The advantage
over using, say, a <div> with a border, is that you can label it. In
a site with headline news, for instance, you could organize the
headlines in this way, and make the contents of the <legend> tag a
link to the full article. In fact, despite the impression it makes
of being purely visual, it seems like more of a structural tag.

Ian
--
http://www.aspipes.org/
http://www.bookstacks.org/
http://www.learnsomethingnew.us/

[Ian Rastall]

On Wed, 04 Feb 2004 04:18:49 -0500, Ian Rastall
<id*******@sbcglobal.net> wrote:

In a site with headline news, for instance, you could organize the
headlines in this way, and make the contents of the <legend> tag a
link to the full article.

Come to think of it, being able to use a <legend> tag to add a
caption to a bordered <div> could be very useful ... forget
<fieldset>.

Ian
--
http://www.aspipes.org/
http://www.bookstacks.org/
http://www.learnsomethingnew.us/

[Harlan Messinger]

"Harlan Messinger" <hm*******************@comcast.net> wrote in message
news:rm********************************@4ax.com...

"Jukka K. Korpela" <jk******@cs.tut.fi> wrote:

I'm sorry, I responded without having looked at his page. Obviously he's NOT
using fieldset the way it's meant to be used. He's using it for a look and
feel that is out of place and on which he can't depend from browser to
browser.

[Jukka K. Korpela]

Harlan Messinger <hm*******************@comcast.net> wrote:

Many people say that <fieldset> and <legend> are broken in _current_
browsers, not to mention old browsers that don't get them at all.

I'm curious what you mean by "broken". I've just used them for the
first time, and find them to look just as they ought to by default in
both IE6 and Mozilla, grouping controls and labeling them. Are they
meant to have some kind of function beyond that?

The people who say that they are broken mainly refer to the visual
appearance that has a border around the fieldset, with the legend
partly covering it. And is there any _functionality_ associated with
fieldset markup? Besides, making the legend obligatory is odd (though
in practice it can be left empty).

It's largely a matter of taste whether such appearance is good or bad,
but it seems to be difficult to style it in CSS - actually I don't
think there's a way to _describe_ all of its features in CSS even in
principle.

I find it somewhat strange that some people refuse to use fieldset in
forms due to the persistent appearance which they regard as poor, and
some other people would use fieldset just because of the appearance.

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

[Harlan Messinger]

"Jukka K. Korpela" <jk******@cs.tut.fi> wrote in message
news:Xn*****************************@193.229.0.31. ..

Harlan Messinger <hm*******************@comcast.net> wrote:

Many people say that <fieldset> and <legend> are broken in _current_
browsers, not to mention old browsers that don't get them at all.
I'm curious what you mean by "broken". I've just used them for the
first time, and find them to look just as they ought to by default in
both IE6 and Mozilla, grouping controls and labeling them. Are they
meant to have some kind of function beyond that?

The people who say that they are broken mainly refer to the visual
appearance that has a border around the fieldset, with the legend
partly covering it.

They call that broken? I don't know about other OSes, but that's what
control group frames have looked like on Windows all along. I never saw
anything wrong with it.
And is there any _functionality_ associated with
fieldset markup? Besides, making the legend obligatory is odd (though
in practice it can be left empty).

It's largely a matter of taste whether such appearance is good or bad,
but it seems to be difficult to style it in CSS -
Ah. I see.
actually I don't
think there's a way to _describe_ all of its features in CSS even in
principle.

I find it somewhat strange that some people refuse to use fieldset in
forms due to the persistent appearance which they regard as poor, and
some other people would use fieldset just because of the appearance.

[Michael Rozdoba]

Jukka K. Korpela wrote:

[snip fieldset/legend comments]

It's largely a matter of taste whether such appearance is good or bad,
but it seems to be difficult to style it in CSS - actually I don't
think there's a way to _describe_ all of its features in CSS even in
principle.

As a matter of interest, can I ask which features you have in mind that
present a problem?

--
Michael
m r o z a t u k g a t e w a y d o t n e t

[Jukka K. Korpela]

Michael Rozdoba <mr**@nowhere.invalid> wrote:

It's largely a matter of taste whether such appearance is good or
bad, but it seems to be difficult to style it in CSS - actually I
don't think there's a way to _describe_ all of its features in CSS
even in principle.

As a matter of interest, can I ask which features you have in mind
that present a problem?

I don't there's a way to describe the rounded corners that e.g. IE
on WinXP uses. Setting border properties for fieldset affects its
special border in some cases (property/browser combinations) only.
The placement of the legend might be describeable using positioning or
negative margins, but I'm not sure how well that would work in
practice, especially since we don't really know what browsers are
doing.

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

[Michael Rozdoba]

Jukka K. Korpela wrote:

Michael Rozdoba <mr**@nowhere.invalid> wrote:

It's largely a matter of taste whether such appearance is good or
bad, but it seems to be difficult to style it in CSS - actually I
don't think there's a way to _describe_ all of its features in CSS
even in principle.
As a matter of interest, can I ask which features you have in mind
that present a problem?

I don't there's a way to describe the rounded corners that e.g. IE
on WinXP uses.

Ah, I've not seen that; yes, it would be tricky.
Setting border properties for fieldset affects its
special border in some cases (property/browser combinations) only.
Ok.
The placement of the legend might be describeable using positioning or
negative margins, but I'm not sure how well that would work in
practice, especially since we don't really know what browsers are
doing.

Yes, this is the bit I had a fiddle with. Thought I'd cracked it with
http://osiris.sunderland.ac.uk/~cd2m...gySeeOpera.htm
but as the file name implies, it doesn't work with Opera (& in any case,
the use of span is hacky in that context).

Putting the legend text into the group div with suitable 0 margin &
padding & setting line height to 0 gets the right result in IE 6 &
Firebird 0.7, but not in Opera 7.23.

A read of the spec suggests Opera is getting it right by assuming
vertical-align of baseline within this zero height box aligned with the
div top border. Setting other aligns on the Span fixes this in Opera but
breaks it in IE. So even if the spec allows it, it doesn't seem to be
easily doable in practice.

A previous attempt with negative margins also looked promising but broke
in IE & I think I've read use of negative margins is less reliable in
practice than tinkering with line-height.

--
Michael
m r o z a t u k g a t e w a y d o t n e t

[Vladdy]

Ian Rastall wrote:

On Wed, 04 Feb 2004 04:10:28 GMT, Bill Mason
<us****@accessibleinter.net> wrote:

I don't see why it is so handy in your example.

It wasn't meant to illustrate its usefullness ... just that it
rendered.

What is the purpose of having it, besides the visual effect?

It's just another way of grouping things together. The advantage
over using, say, a <div> with a border, is that you can label it. In
a site with headline news, for instance, you could organize the
headlines in this way, and make the contents of the <legend> tag a
link to the full article. In fact, despite the impression it makes
of being purely visual, it seems like more of a structural tag.

Ian

If you are just after the looks, you can achieve pretty much the same
rendering with a regular markup:
http://www.vladdy.net/demos/fieldsetlegendlook.html

--
Vladdy
http://www.klproductions.com

[Nick Kew]

In article <Xn*****************************@193.229.0.31>,
"Jukka K. Korpela" <jk******@cs.tut.fi> writes:

And is there any _functionality_ associated with
fieldset markup?

Most obviously, a group of radio buttons is a functional
relationship and benefits from being presented to the user.

Otherwise, it may serve to delimit an entire Form or part.

--
Nick Kew