Playgrounds
Snippets
Developers
Compiler
All
ActionScript
Ajax
AngularJS
Apache
AppleScript
ASP.NET
Bash
C
C#
C++
Coffee
CoffeeScript
ColdFusion
Command
CSS
Delphi
Django
ES6
GLSL
Grunt
Gulp
HAML
Haskell
HTML
iOS
Jade
Java
JavaScript
jQuery
JSX
Less
LUA
MDX
MySQL
Objective
Other
Pascal
Perl
PHP
Plain text
PowerShell
Processing
Progress
Prolog
Pseudocode
Python
Rails
RegExr
Ruby
SASS
Scala
Scheme
SCSS
SmallBASIC
Smarty
SQL
Stylus
SVG
Swift
TypeScript
VHDL
X++
XHTML
XML
Xojo
XSLT
New snippet
New playground
Sign up
Login
Upload
Playgrounds
Snippets
Developers
Sign up
Login
Playground Settings
HTML
CSS
JAVASCRIPT
HTML Preprocessor
HTML
HTML
HAML
JADE
Stuff for <head>
<!-- Viewport --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Google Fonts --> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"> <!-- CSS Reset --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.css"> <!-- Milligram CSS minified --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.1.0/milligram.min.css"> <style>body{padding:20px}</style>
Save
Cancel
CSS Preprocessor
CSS
CSS
SASS
SCSS
LESS
Stylus
Quick Add
---
Animate.css
Bootstrap
Foundation
Add external resource
External CSS
Save
Cancel
Javascript Preprocessor
Javascript
Javascript
Babel
TypeScript
Coffee
Quick Add
---
Angular
Backbone
Bootstrap
D3
Ember
GreensockTweenMax
Handlebars
jQuery
jQuery UI
Knockout.js
Lodash
Modernizr
Polymer
React
React DOM
Snap.svg
Three.js
Underscore
Zepto
Add external resource
External JS
Save
Cancel
Milligram - Forms
HTML
<form> <fieldset> <label for="nameField">Name</label> <input type="text" placeholder="CJ Patoilo" id="nameField"> <label for="ageRangeField">Age Range</label> <select id="ageRangeField"> <option value="0-13">0-13</option> <option value="14-17">14-17</option> <option value="18-23">18-23</option> <option value="24+">24+</option> </select> <label for="commentField">Comment</label> <textarea placeholder="Hi CJ …" id="commentField"></textarea> <div class="example-send-yourself-copy"> <input type="checkbox" id="confirmField"> <label class="label-inline" for="confirmField">Send a copy to yourself</label> </div> <input class="button-primary" type="submit" value="Send"> </fieldset> </form> <!-- Always wrap checkbox and radio inputs in a label and use a <span class="label-inline"> inside of it -->
CSS
JAVASCRIPT
/* The Form has never been exactly fun, and it can be downright painful on a mobile device with its on-screen keyboard. Milligram help to make this much easier with design focused on the user experience. https://github.com/milligram/milligram https://milligram.github.io */
Run
Expand for more options
Login
The Form has never been exactly fun, and it can be downright painful on a mobile device with its on-screen keyboard. Milligram help to make this much easier with design focused on the user experience.
https://github.com/milligram/milligram
https://milligram.github.io
0
23
2288
Share
Created by
Milligram