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:
• HTML dfn Tag
• HTML Frames Basics
• Line Breaks in HTML
• Can Enterprise Applications Be Made Using HTML5?
• HTML title Tag
• HTML Linking Basics
• HTML Text Tags Basics
• HTML DIV Basics
• How to Use a Meta Redirect
• Providing Alternate and Title Text for an Image

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-2018 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268