JSFiddle - React, Tailwind, and code Playground

by Ian Sanders

HTML

<form id="form1" name="form1" method="post" action="">
  <p>
    <label>Text Field:
      <input name="textfield" type="text" id="textfield" value="JohnDoe1234" />
    </label>
  </p>
  <p>
    <label>Text Field:
      <input name="textfield2" type="text" disabled="disabled" id="textfield2" value="Disabled" />
    </label>
  </p>
  <p>
    <label>Password Field:
      <input name="Password" type="password" id="Password" value="Password" />
    </label>
  </p>
  <p>
    <label>Text Area:
      <textarea name="textarea" id="textarea" cols="30" rows="3"></textarea>
    </label>
  </p>
  <p>
    <label>Text Area:
      <textarea name="textarea2" disabled="disabled" id="textarea2" cols="30" rows="3"></textarea>
    </label>
  </p>
  <p>
    <label>
      <input type="checkbox" disabled="disabled" name="Options" value="one" id="Options_0" />
      Option 1</label>
    <br />
    <label>
      <input name="Options" type="checkbox" id="Options_1" value="two" checked="checked" />
      Option 2</label>
    <br />
    <label>
      <input type="checkbox" name="Options" value="three" id="Options_2" />
      Option 3</label>
  </p>
  <p>
    <label>
      <input type="radio" disabled="disabled" name="Choices" value="one" id="Choices_0" />
      Choice 1</label>
    <br />
    <label>
      <input name="Choices" type="radio" id="Choices_1" value="two" checked="checked" />
      Choice 2</label>
    <br />
    <label>
      <input type="radio" name="Choices" value="three" id="Choices_2" />
      Choice 3</label>
  </p>
  <p>
    <label>Select List:
      <select name="select" id="select">
        <option value="one">Select 1</option>
        <option value="two">Select 2</option>
        <option value="three">Select 3</option>
      </select>
    </label>
  </p>
  <p>
    <label>Select List (Large):
      <select name="select" size="3" id="select">
        <option selected="selected" value="one">Select 1</option>
        <option value="two">Select 2</option>
        <option...

CSS

input, button, textarea, select {
    -webkit-box-shadow: 0px 0px 5px black;
    -moz-box-shadow:    0px 0px 5px black;
    box-shadow:         0px 0px 5px black;
    display: inline-block;
    margin: 5px 0 5px 0;
}

form {
    padding: 10px;
}