Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <form>
    <label>Unrelated:</label>
    <input type="text" name="text" id="text">
​
    <label for="text2">Related:</label>
    <input type="text" name="text2" id="text2">
    
    <label>Also related:
      <input type="text" name="text3" id="text3">
    </label>
    
    <fieldset>
      <legend>Radio buttons</legend>
      <input type="radio" name="radio" id="yes">
      <label for="yes">Yes</label>
      <input type="radio" name="radio" id="no">
      <label for="no">No</label>
    </fieldset>
    
    <fieldset>
      <legend>Checkboxes</legend>
      <input type="checkbox" name="sunday" id="sunday">
      <label for="sunday">Sunday</label>
      
      <input type="checkbox" name="monday" id="monday">
      <label for="monday">Monday</label>
      
      <input type="checkbox" name="tuesday" id="tuesday">
      <label for="tuesday">Tuesday</label>
      
      <input type="checkbox" name="wednesday" id="wednesday">
      <label for="wednesday">Wednesday</label>
      
      <input type="checkbox" name="thursday" id="thursday">
      <label for="thursday">Thursday</label>
      
      <input type="checkbox" name="friday" id="friday">
      <label for="friday">Friday</label>
      
      <input type="checkbox" name="saturday" id="saturday">
      <label for="saturday">Saturday</label>
    </fieldset>
    
    <fieldset>
      <legend>Dropdown</legend>
      <select>
        <option selected disabled>Choose a fruit:</option>
        <option>Apples</option>
        <option>Coconuts</option>
        <option>Chocolate</option>
        <option>Oranges</option>
        <option>Pancakes</option>
        <option>Peaches</option>
        <option>Pizza</option>
      </select>
    </fieldset>
    <input type="submit" value="Send">
  </form>
</body>
</html>
 
body {
  padding-right: 20px;
  padding-left: 20px;
  font-size: 40px;
  font-weight: 300;
  font-family: "Niveau Grotesk", sans-serif;
}
​
input[type="text"], input[type="submit"], fieldset {
  margin-bottom: 24px;
  display: block;
}
​
input[type="text"] {
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
  font-size: 28px;
  font-weight: 300;
  font-family: "Niveau Grotesk", sans-serif;
}
​
input[type="radio"] + label, input[type="checkbox"] + label {
  position: relative;
  top: 5px;
  font-size: 28px;
}
 
​
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers