Cacher is the code snippet organizer for pro developers

<form>
  <fieldset>
    <legend>Fieldset number 1</legend>
    <div>
      <label for="name">Name: </label>
      <input type="text" name="name" id="name">
    </div>

    <div>
      <h4>Radio Button Choice</h4>

      <input type="radio" name="radioButton" id="radio1">
      <label for="radio1">Choice 1</label>

      <input type="radio" name="radioButton" id="radio2">
      <label for="radio2">Choice 2</label>

      <input type="radio" name="radioButton" id="radio3">
      <label for="radio3">Choice 3</label>
    </div>

    <div>
      <label for="selectThis">Select:</label>
      <select name="selectThis" id="selectThis">
        <optgroup label="Group 1">
          <option value="0">Choose an option</option>
          <option value="1">Option 1</option>
          <option value="2">Option 2</option>
        </optgroup>

        <optgroup label="Group 2">
          <option value="3">Option 3</option>
          <option value="4">Option 4</option>
          <option value="5">Option 5</option>
        </optgroup>

      </select>
    </div>
	</fieldset>

  <fieldset>
    <legend>Fieldset number 2</legend>
    <div>
      <label for="textarea">Textarea:</label>
      <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
    </div>
  	
    <div>
      <input type="checkbox" id="checkbox1">
      <label for="checkbox1">Option 1</label>

      <input type="checkbox" id="checkbox2">
      <label for="checkbox2">Option 2</label>

      <input type="checkbox" id="checkbox3">
      <label for="checkbox3">Option 3</label>    
    </div>

    <div>
      <input type="submit" value="Submit">
    </div>
  </fieldset>
</form>

<form>
	<div>
		<label for="myEmail">E-mail: </label>
		<input type="email" id="myEmail" name="myEmail">
	</div>

	<div>
		<label for="searchThis">Search: </label>
		<input type="search" id="searchThis" name="searchThis">
	</div>

	<div>
		<label for="numberTypes">Enter value: </label>
		<input type="number" id="numberTypes" name="numberTypes" min="1" max="10">
	</div>

	<div>
		<label for="colorType">Color: </label>
		<input type="color" id="colorType" name="colorType">
	</div>

	<div>
		<label for="dateSelect">Date: </label>
		<input type="date" id="dateSelect" name="dateSelect">
	</div>
</form>

<form action="">
	<div>
		<!-- checked only works for radio and checkbox -->
		<input type="checkbox" id="check1" name="check1" checked>
		<label for="check1">Option 1</label>

		<input type="checkbox" id="check2" name="check2">
		<label for="check2">Option 2</label>

		<input type="checkbox" id="check3" name="check3">
		<label for="check3">Option 3</label>
	</div>

	<div>
		<input type="submit" value="submit" disabled>
	</div>

	<div>
      <label for="selectThis">Select:</label>
      <select name="selectThis" id="selectThis" multiple size="10">
          <option value="0">Choose an option</option>
          <option value="1">Option 1</option>
          <option value="2">Option 2</option>
      </select>
    </div>

    <div>
      <label for="selectThis">Select:</label>
      <select name="selectThis" id="selectThis">
          <option value="0">Choose an option</option>
          <option value="1">Option 1</option>
          <option value="2">Option 2</option>
          <option value="3" selected>Option 3</option>
          <option value="4">Option 4</option>
      </select>
    </div>

    <div>
      <label for="placeholderDemo">Name: </label>
      <input type="text" id="placeholderDemo" name="placeholderDemo" placeholder="e.g. John Smith">
    </div>
</form>