<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="card card-container"> <!-- <img class="profile-img-card" src="//lh3.googleusercontent.com/-6V8xOA6M7BA/AAAAAAAAAAI/AAAAAAAAAAA/rzlHcD0KYwo/photo.jpg?sz=120" alt="" /> --> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:10%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:40%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:70%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <br/><br/><br/> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:10%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:40%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:70%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <br/><br/><br/> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:10%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:40%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> <img id="profile-img" class="profile-img-card" style="display:inline; position:relative; left:70%" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" /> </div><!-- /card-container --> </div><!-- /container -->

/* * Specific styles of signin component */ /* * General styles */ body, html { height: 100%; background-repeat:repeat; background-image: linear-gradient(rgb(104, 145, 162), rgb(12, 97, 33)); } .card-container.card { max-width: 100%; } /* * Card component */ .card { background-color: #F7F7F7; /* just in case there no content*/ padding: 20px 25px 30px; margin: 0 auto 25px; margin-top: 50px; /* shadows and rounded borders */ -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); } .profile-img-card { width: 76px; height: 76px; margin: 0 auto 10px; display: block; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }