<< Click here to Goto HomePage

     
     

Thursday, December 14, 2006

How to create a Group Box in HTML?

Today I was faced with a rather strange requirement - How to create a Group Box in HTML?
For those of you who don't know what a Group Box is.... here is a screen shot of it.





This is very simple to do in a Windows Application, but here I was needed to replicate the same in HTML. Well, I did a bit of research and found a very simple way to get a Group Box on the web.

The fieldset tag is used to group multiple elements together on a page and provide a caption for the grouping. The caption is supplied with the legend tag inside the fieldset.

So here's the simple code for it:



<fieldset style="width:100px;">

<legend>

Please Enter Your Name</legend>

<br>

<table>

<tr>

<td>First Name:</td>

<td><input type="text" /></td>

</tr>

<tr>

<td>Last Name:</td>

<td><input type="text" /></td>

</tr>

</table>

</fieldset>





The output of the webpage is:

3 comments:

  1. Anonymous said,

    Thanks a lot!
    fieldset worked

    on 8/12/2008 1:10 PM


  2. hussain said,

    thanks a lot, field set worked but dns flush succes, release failed, renew failed Error message is "the operation failed as no adapter in the state permissible for this operation"
    i didn't clear about the state in Err msg. pls sent me the clarification as soon as possible my email id: thahahussain6@gmail.com

    on 9/03/2009 7:57 AM


  3. Abhishe said,

    Thanks a lot, mate! Worked great.

    on 3/25/2010 1:04 PM