<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.3.min.js" data-semver="2.1.3" data-require="jquery@2.1.3"></script>
<link data-require="semantic-ui@1.11.4" data-semver="1.11.4" rel="stylesheet" href="//cdn.jsdelivr.net/semantic-ui/1.11.4/semantic.min.css" />
<script data-require="semantic-ui@1.11.4" data-semver="1.11.4" src="//cdn.jsdelivr.net/semantic-ui/1.11.4/semantic.min.js"></script>
</head>
<body>
<br>
<br>
<!--
<div class="ui page grid">
<div class="row">
<div class="sixteen wide mobile seven wide tablet six wide computer five wide large screen four wide widescreen centered column">
<form class="ui form">
<p class="ui dividing header">1) sixteen wide mobile eight wide tablet eight wide computer six wide large screen 4 wide widescreen centered column</p>
<div class="ui hidden divider"></div>
<h1 class="ui dividing centered header">Sign In</h1>
<div class="field">
<input name="userEmail" placeholder="Email" type="email">
</div>
<div class="field">
<input name="userPassword" placeholder="Password" type="password">
</div>
<div class="field">
<div class="ui checkbox">
<input name="userRememberMe" type="checkbox">
<label>Remember me</label>
</div>
</div>
<div class="ui hidden divider"></div>
<div class="fluid ui primary button">Sign In</div>
</form>
</div>
</div>
</div>
-->
<br>
<br>
<br>
<br>
<br>
<br>
<div class="ui one column stackable centered page grid">
<div class="column eight wide">
<form class="ui form">
<p class="ui dividing header">1) centered</p>
<div class="ui hidden divider"></div>
<h1 class="ui dividing header">Sign In</h1>
<div class="field">
<input name="userEmail" placeholder="Email" type="email">
</div>
<div class="field">
<input name="userPassword" placeholder="Password" type="password">
</div>
<div class="field">
<div class="ui checkbox">
<input name="userRememberMe" type="checkbox">
<label>Remember me</label>
</div>
</div>
<div class="ui hidden divider"></div>
<div class="fluid ui primary button">Sign In</div>
</form>
</div>
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<div class="ui one column stackable center aligned page grid">
<div class="column eight wide">
<form class="ui form">
<p class="ui dividing header">2) center aligned</p>
<div class="ui hidden divider"></div>
<h1 class="ui dividing header">Sign In</h1>
<div class="field">
<input name="userEmail" placeholder="Email" type="email">
</div>
<div class="field">
<input name="userPassword" placeholder="Password" type="password">
</div>
<div class="field">
<div class="ui checkbox">
<input name="userRememberMe" type="checkbox">
<label>Remember me</label>
</div>
</div>
<div class="ui hidden divider"></div>
<div class="fluid ui primary button">Sign In</div>
</form>
</div>
</div>
</body>
</html>