html - how to divide the input into two in single line -
in code below, getting 1 one input fields, want display single line, 2 input fields want show.
now output:
name password
expected output:
name password
can 1 me
updated html
<div> <input type="text" name="name" class="login-input" placeholder=" name" autofocus> <input type="password" name="password" class="login-input" placeholder="password"> <input type="text" name="father_name" class="login-input" placeholder=" father name" autofocus> </div> <div> <input type="text" name="mother_name" class="login-input" placeholder=" mother name" autofocus> <textarea type="text" name="adress" class="login-input" placeholder=" address" cols="40" rows="6" autofocus></textarea> </div>
css:
.login-input { display: inline-block width: 100%; height: 37px; margin-bottom: 20px; padding: 0 21px; color: white; text-shadow: 0 1px black; background: #2b3e5d; border: 1px solid #15243b; border-top-color: #0d1827; border-radius: 4px; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2); }
use display: inline-block
instead of display: block
, put every input fields want group in separate div
's.
Comments
Post a Comment