JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.css">
<div class="container">
    <div class="row">
        <div class="col-xs-12">
            <label>Name</label>
            <input type="text" class="form-control">
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <label>Option</label>
            <select class="form-control">
                <option></option>
                <option>Option 1</option>
                <option>Option 2</option>
                <option class="hidden-xs">Option Hidden Phone</option> <!-- Doesn't hide on iOS whether I use "hidden-xs" or "hidden" -->
            </select>
        </div>
    </div>
    <div class="row hidden-xs"> <!-- Will hide in this fiddle but not in my real scenario.. -->
        <div class="col-xs-12">
            <label>Mobile number</label>
            <input type="text" class="form-control">
        </div>
    </div>
</div>