Welcome to Bucaro TecHelp!

Bucaro TecHelp
HTTPS Encryption not required because no account numbers or
personal information is ever requested or accepted by this site

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Use fieldset to Organize Form Elements

The <fieldset></fieldset> tags provide a way to organize groups of related form input elements. The <fieldset> tag draws a box around the related elements. Shown below is example code that uses the html fieldset tags.

<form method="get" action="program_name" style="width:240px;">
<fieldset>
Name: <input type="text"><br />
Dept: <input type="text"><br />
Title: <input type="text"><br />
Email: <input type="text"><br />
</fieldset>
<fieldset>
<input type="checkbox" name="Red">Red<br />
<input type="checkbox" name="Green">Green<br />
<input type="checkbox" name="Blue">Blue<br />
</fieldset>
</form>

Shown below is how fieldsets would appear on a web page.

Name:
Dept:  
Title:   
Email: 
Red
Green
Blue

The fieldset tags are commonly used along with the <legend></legend> tags, which provide a way to label the groups of related form elements.

Personal Information Name:
Dept:  
Title:   
Email: 
Color Preferences Red
Green
Blue

Shown below is example code that uses the legend tags along with the fieldset tags.

<form method="get" action="program_name" style="width:240px;">
<fieldset>
Personal Information
Name: <input type="text"><br />
Dept: <input type="text"><br />
Title: <input type="text"><br />
Email: <input type="text"><br />
</fieldset>
<fieldset>
<legend>Color Preferences</legend>
<input type="checkbox" name="Red">Red<br />
<input type="checkbox" name="Green">Green<br />
<input type="checkbox" name="Blue">Blue<br />
</fieldset>
</form>

Placing a class or id attribute inside the opening <fieldset> allows you to apply CSS styles to the border and background of the fieldset.

More HTML Code:
• Webpage DOCTYPE Declarations Explained
• Use HTML Target Attribute to Specify Where to Open Document
• Use Meta Tags for Search Engine Optimization
• Easy Form Design
• HTML abbr and acronym Tag
• Providing Alternate and Title Text for an Image
• HTML Text Tags Basics
• HTML Textarea Basics
• HTML Image Basics
• Introduction to HTML

RSS Feed RSS Feed

Follow Stephen Bucaro Follow @Stephen Bucaro



Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2024 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268