JSFiddle - React, Tailwind, and code Playground
by planetoftheweb
HTML
<form action="mailto:[email protected]" method="post">
<!-- Text Input Field -->
<label for="nameid">Your Name</label>
<input name="formname" id="nameid" placeholder="Please enter your name" required style="width: 300px;"/><br />
<!-- Hidden Input Field -->
<input type="hidden" name="origin" value="planetoftheweb" />
<!-- Password Input Field -->
<label>
Password
<input type="password" name="password" autofocus /><br />
</label>
<!-- Radio Input Field -->
Rate this class:
<input type="radio" name="rating" value="1" id="rating1"/>
<label for="rating1">1</label>
<input type="radio" name="rating" value="2" id="rating2" />
<label for="rating2">2</label>
<input type="radio" name="rating" value="3" id="rating3" />
<label for="rating3">3</label>
<input type="radio" name="rating" value="4" id="rating4" />
<label for="rating4">4</label>
<input type="radio" name="rating" value="5" id="rating5" checked />
<label for="rating5">5</label>
<!-- Checkbox Input Field -->
Which of these do you like:
<input type="checkbox" name="like" value="a" id="like_country" />
<label for="like_country">Country</label>
<input type="checkbox" name="like" value="b" id="like_rock" />
<label for="like_rock">Rock</label>
<input type="checkbox" name="like" value="c" id="like_metal" />
<label for="like_metal">Metal</label>
<input type="checkbox" name="like" value="d" id="like_reggaeton" checked />
<label for="like_reggaeton">Reggaeton</label>
<input type="checkbox" name="like" value="e" id="like_cumbia" />
<label for="like_cumbia">Cumbia</label>
<br />
<!-- TextArea Field -->
<label> Comments
<textarea rows="1" name="comments">This is some text</textarea>
</label><br />
<!-- PopUp Menus -->
<label> How did you hear about our site?
<select name="referral">
<option>Choose...</option>
<option value="site">Website</option>
<option...
CSS
body {
font-family: verdana
}