<form method='post' action='data:text/plain, Form submited.'>
  <fieldset>Your name:<br><input type='text'></fieldset>
  <fieldset>
    Product:
    <input type='radio' id='unspecify-product' name='product' value='unspecify' checked>
    <label for='unspecify-product'>Unspecify</label>
    <br>
    <input type='radio' id='desktop-product' name='product' value='desktop'>
    <label for='desktop-product'>Desktop</label>
    <br>
    <input type='radio' id='mobile-product' name='product' value='mobile'>
    <label for='mobile-product'>Mobile</label>
  </fieldset>
  <p><input type='submit' value='Contact Us'></p>
</form>
<p class='explain'>This is a demo that styles form for mobile device.</p>
@mixin greeny-ui {
  background-color: YELLOWGREEN;
  color: white;  
  border: 1px solid rgba(0,0,0,.1);
  box-shadow: inset 0 1px rgba(255,255,255,.3), inset 0 -1px rgba(0,0,0,.1);
  
  &:hover {
    background-color: darken(YELLOWGREEN, 10%);
    box-shadow: inset 0 1px rgba(255,255,255,.7), inset 0 -1px rgba(0,0,0,.1);
  }
  &:active {
    background-color: YELLOWGREEN;
    box-shadow: inset 0 -1px rgba(255,255,255,.1), inset 0 1px rgba(0,0,0,.1);
  }
}
* {
  box-sizing: border-box;
}
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

input[type='text'],
input[type='submit']{
  width: 100%;
  padding: 1rem .5rem;
  font-size: 1rem;  
  border: 1px solid #efefef;
}

input[type='radio'] {
  display: none;
  
  &+label{
    display: block;
    font-size: 1rem;  
    padding: 1rem .5rem;
    padding-left: 3rem;
    border: 1px solid transparent;
  }
  &:checked+label {
    border-color:YELLOWGREEN;
    background: lighten(YELLOWGREEN, 49%) url(https://css3effects.com/tick.png) 10px 50% no-repeat;
  }
}


input[type="submit"],
input[type="button"]{
  appearance: none;  /* for mobile safari */
  border-radius: 3px;
  @include greeny-ui;
}

.explain {
  font-size: .8rem;
  color: darkgrey;
  text-align: center;
}
View Compiled
$("input[type=submit]").bind 'touchstart', (e) ->
  e.preventDefault()
$("input[type=submit]").bind 'touchend', (e) ->
  e.preventDefault()
  $(this).trigger 'click'

View Compiled
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js