question about the fieldset tag

@mididelightNov 08.2004

i know the fieldset tag is used for form controls and puts a nice border surrounding whichever controls you want grouped.

but i noticed that it actually looks good (with a little css) to put around blocks of text. check out this page i did: ~~[url]~~http://www.mididelight.com/misc/about.php[/url] I like how the legend box adds a nice 3d box appeal.

my question is, is it wrong to use the fieldset tag in places other than forms? I know syntactically its correct, I just dont know semanticly.

Anyone have any idea?

to post a comment

Full-stack Developer

17 Comments(s) _↴

@russellNov 08.2004 — #Definitely use html tags as you see fit to create the display you want. A great example of this is the table tag, which was inteded for displaying tabular data, but was immediately (and still is) used for layout purposes.

@mididelightauthorNov 08.2004 — #but i just know there are those die-hard css/validator/xhtml webmasters that will say i am supposed to only use fieldset tags for forms.

i am wondering if its just fround upon to do it my way or it will really cause errors?

@JonaNov 08.2004 — #[i]Originally posted by mididelight [/i]

[B]but i just know there are those die-hard css/validator/xhtml webmasters that will say i am supposed to only use fieldset tags for forms.

i am wondering if its just fround upon to do it my way or it will really cause errors? [/B][/QUOTE]

[font=trebuchet ms]It's definitely not recommended; the fieldset tag is for form controls only. What you want to do can be accomplished without a large hassle, without the fieldset/legend tags.[/font]

<i>
 </i>&lt;div style="width: 200px; border: solid 1px #000; font-size: small; margin-top: 2em;"&gt;
 &lt;h2 style="border: solid 1px #000; padding: 2px; margin-top: -1em; margin-left: 0.5em; background: #fff; width: 70px; font-size: medium;"&gt;About us&lt;/h2&gt;
 &lt;p style="padding: 5px;"&gt;MIDI Delight was created in 1998, etc., etc., etc., etc., etc., etc., etc., etc.&lt;/p&gt;
 &lt;/div&gt;

@MstrBobNov 08.2004 — #[i]Originally posted by russell [/i]

[B]Definitely use html tags as you see fit to create the display you want. A great example of this is the table tag, which was inteded for displaying tabular data, but was immediately (and still is) used for layout purposes. [/B][/QUOTE]

Wow, and this, ladies and gents, is why web technologies are static today. So then, you'd suggest using improper markup simply because it looks good? Because markup was intended for visuals right? Hey, screw the blind, and people using anything other than a graphical browser. Why do they need to see the page?

Sorry, but that makes no sense. As Jona has showed, the effect can easily be achieved with symantic markup that will work properly for all browsers. Also, add this :

position:relative;z-index:2;

to the h2 tag, because IE doesn't follow many rules of CSS.

@JonaNov 08.2004 — #[i]Originally posted by MstrBob [/i]

[B]Also, add this :

position:relative;z-index:2;

to the h2 tag, because IE doesn't follow many rules of CSS. [/B][/QUOTE]

[font=trebuchet ms]Thanks, I forgot to test it in IE.[/font]

@mididelightauthorNov 08.2004 — #thanks guys, i took your advise and edit my code, minus the fieldset stuff.... although i like the fieldset tag and legend tag.

i will shelve it untill i have a better use for it.

@mididelightauthorNov 08.2004 — #actually i have a question,

is there a way to make the box around the header expand/contract with the size in length of the title.

for example, if the title is "this is the longest title ever", then the box will resize to fix the text

@JonaNov 09.2004 — #[i]Originally posted by mididelight [/i]

[B]actually i have a question,

is there a way to make the box around the header expand/contract with the size in length of the title.

for example, if the title is "this is the longest title ever", then the box will resize to fix the text [/B][/QUOTE]

[font=trebuchet ms]Yes, so long as it's not longer than the box itself.[/font]

<i>
 </i>&lt;div style="width: 90%; border: solid 1px #000; font-size: small; margin: 2em auto;"&gt;
 &lt;h2 style="border: solid 1px #000; padding: 2px; margin-top: -1em; margin-left: 0.5em; margin-right: 0.5em; background: #fff; font-size: medium; white-space: nowrap; position: relative; z-index: 2"&gt;This is the longest title ever before ha ha ha&lt;/h2&gt;
 &lt;p style="padding: 5px;"&gt;MIDI Delight was created in 1998, etc., etc., etc., etc., etc., etc., etc., etc.&lt;/p&gt;
 &lt;/div&gt;

@russellNov 09.2004 — #Wow, and this, ladies and gents, is why web technologies are static today. So then, you'd suggest using improper markup simply because it looks good? Because markup was intended for visuals right? Hey, screw the blind, and people using anything other than a graphical browser. Why do they need to see the page?[/QUOTE]

mstrBob, how you can equate using tables and fieldset tags with "screw the blind" is beyond me. You want to make a statement about the virtues of css go for it, and i'll agree. Telling someone not to use a fieldset tag because they'll be insensitive to the blind is idiotic.

Also, how in the world did you get the idea that web technologies today are static? They are anything but.

As far as suggesting markup because it looks good, yes. Markup was [i]invented for display[/i]. What did you think it was for?

Again, I agree that CSS with valid HTML is the best solution in most www cases. But your comments on the subject are ill-informed and out of context of the original question.

@Stephen_PhilbinNov 09.2004 — #[i]Originally posted by russell [/i]

[B]mstrBob, how you can equate using tables and fieldset tags with "screw the blind" is beyond me.[/B][/QUOTE]

Ignorance is no excuse for apathy.

[i]Originally posted by russell [/i]

[B]Markup was [i]invented for display[/i]. What did you think it was for?[/B][/QUOTE]

No. It wasn't. It's called "Hypertext Markup Language", not "Hypertext, visual and a few other bits and bobs Markup and scripting Language".

[i]Originally posted by russell [/i]

[B]Again, I agree that CSS with valid HTML is the best solution in most www cases. But your comments on the subject are ill-informed[/B][/QUOTE]

No. They aren't.

@JonaNov 09.2004 — #[font=trebuchet ms]Mr Herer, it may be best to [i]explain[/i] your convictions, rather than speak so boldly.

Read, study, and inwardly digest the [url=http://www.w3.org/TR/WAI-WEBCONTENT/]Web Content Accessibility Guidelines[/url]. The specification itself says to read each document [b]fully[/b] with good reason.[/font]

@NevermoreNov 09.2004 — #Markup was invented for display purposes; just not HTML markup. Markup has different uses, depending on the application in use:

Markup:

Special codes in a document that specify how parts of it are to be processed by an application. In a word-processor file, markup specifies how the text is to be formatted; in an HTML document, the markup specifies the text's structural function (heading, title, paragraph, etc.).

@MstrBobNov 09.2004 — #To say that HTML is merely for display purposes is ignorant. HTML was created to aide in sharing data across computers, and different platforms. HTML at it's core is not meant for display, but rather to markup data. During the browser wars, superflouous tags were added by browser makers to help get their product to the top.

But now, let's examine this. One must realize today that the web is much more than PCs with graphical browsers. There are many other devices on the web. One often ignored one are devices for the blind. Braille browsers. One needs to rely on the HTML to identify data. Tables used for layout don't help in this, and won't linearize properly. Because how will it know the proper way to do it? Not to mention that all these extra tags simply clutter up and increase page size. CSS separates all presentation from the page. It makes everything more modular. Only devices that can deal with the presentation will get it, so it is much more efficient.

And when I say web technologies seem more stagnant today, I really should revise. Our bread and butter of the web, HTML and CSS, are stagnant. Much work is being done by the [URL=http://www.w3c.org]W3C[/URL] but we are stuck with an [URL=http://www.microsoft.com/downloads/details.aspx?FamilyID=1e1550cb-5e5d-48f5-b02b-20b602228de6&displaylang=en]archaic browser[/URL] which dominates the web. This program is far behind in areas like CSS and XML support. Hell, it can't even properly handle png images. These newer technologies can't be put to as wide spread use as they should be able to, because Internet Explorer won't support them. But users won't get rid of it. So it really is making progress slow. IE was the first browser with CSS support, but even as of version 6, it's CSS 1 support is off, CSS 2 support is sketchy, and I doubt we'll see any CSS 3. A simple XML declaration throws this browser into quirks mode, and it can't handle XHTML pages served up as applications of XML. Tis truly sad. But enough on that tangent. To use tables for layout is to suffer from uneducation.

@Stephen_PhilbinNov 09.2004 — #[i]Originally posted by Jona [/i]

[B][font=trebuchet ms]Mr Herer, it may be best to [i]explain[/i] your convictions, rather than speak so boldly.[/font] [/B][/QUOTE]

My bad. I just don't take kindly to this "people that actively encourage web standards are fools" attitude.

@JonaNov 09.2004 — #[i]Originally posted by Mr Herer [/i]

[B]My bad. I just don't take kindly to this "people that actively encourage web standards are fools" attitude. [/B][/QUOTE]

[font=trebuchet ms]No one takes kindly to opposing attitudes, but you should look from others' point-of-view and explain things with love and care for others. You may feel the way they do on the opposite side. Both sides aren't entirely bad - think of Robert E. Lee and Ulysses S. Grant - they were on different sides, but both were great men of valor.[/font]

@russellNov 09.2004 — #mstrBob and Mr Herer both miss the point. No one said that markup is for display purposes only. No one said that actively encouraging standards is foolish. What is foolish is to get on a soapbox and say "Do it my way because I follow the latest W3C reccomendation -- or else your doing it wrong." What else is foolish? How about "if($MSIE){incinerate($user);} Pretty sure that's just for fun, but who is being ignorant here? I'll take 92% of the customers and you take the rest. I'll even give ya ALL of my blind customers.

Now, I encourage following standards too, but not to the exclusion of all else. There are many different implementations of the "standard" out there. Netscape 7, Firefox, or whatever your favorite browser is, is no better overall than MSIE 6. Different yes. Better in some respects, worse in others.

It is also important to have accessible web sites for all users. Well, almost all users. I'm not going to worry too much about those who turn off cookies in an e-commerce site. I'll say "You must enable cookies to fully utilize this site." I'll provide content that renders in any UA. What, you are using a braille browser? Here's my toll-free #. Call so we may better serve you.

The "standard" you lean on is an evolving set of reccomendations. It is a fine piece of work, put together with the efforts of many good people. It is not the end-all/be-all of web programming. It's better to reach 90%+ of your potential customers with really compelling content and tools, and provide something not quite as good for the rest -- which is really what you are trying to do with you standards only approach anyway. I can throw in some IE only techniques and make it better for IE users. Fine. Does doing so say "Screw the Blind"? Of course not. The OP posed the question: "Is it ok to use the fieldset tag?" to make a better display. The answer is a resounding yes.

@MstrBobNov 10.2004 — #I really think you're missing the point of standards. The idea is to make the web as accessible as possible to the largest amount of users on varied devices. This by no means leaves out IE. IE users are users as well, even if they are stuck with an [I]inferior[/I] browser. How, pray tell, is IE better than other standard-complaint browsers? What miraculous feature does it have? The gaping security wholes that have infected 80%+ of internet users with adware, spyware, and viruses? It's not even a matter of downloading suspicious programs anymore. Simply browsing webpages with IE is unsafe. And IE is greatly hindering the implementation of new web technologies. Its an archaic browser and needs to go. I see no reason to hold on to it, other than the fact that some websites unfortunately rely on Active X. (I recall reading something about an Active X extension for Mozilla. Though it'd be a security threat, it'd give you that added functionality) Opera, Mozilla, Safari - these represent browsers more dedicated than IE.

You don't want to comply to accessibility laws, go right ahead. You feel like screwing off that 12% go right ahead. Sure, people don't care, unless you're that freakin 12% being screwed over by lazy webmasters. Yes lazy. Rather harsh, but the true fact here is that websites today could be drastically reduced in size, and become much more accessible if time and thought were put into it. A valid, accessible website will not hinder, but rather help you. I feel it's the webmaster's job to create a good website, and it's just a pity that there are so many webmasters out there that think HTML is the be-all and end-all, and that Javascript is uber cool for vital functions like navigation, because people that don't have Javascript, or choose to disable it are uncool.

It's the whole mentality that goes along with this is the real issue. "Hell man, if it ain't broke, don't fix it" Except it is broken. The web would be a much more flexible, powerful tool if people went with separating markup from presentation. With it, you have the ability to completely change the look of a website for different devices. Using the exact same page without changing markup, and simply the proper CSS declarations, one can change the appearance of a website for graphical browsers, for handheld devices, and for printers. You can remove large sections, or have a new layout simply by linking to a stylesheet for that device. You cannot argue that using your presentational markup is better. Because you can be one of those people that says "I use CSS for fonts and colors" but if you're using a freaking table tag for a layout, or placing bunches and bunches of <div> tags all over the place, you've missed the whole point.

"is it wrong to use the fieldset tag in places other than forms? "

Yes. The markup is no longer accurately describing your data. At that point, what is the real point of the markup. When it's not describing the data, what is it good for? Use appropriate markup, and style afterwards. Properly marked up pages are much easier to style.