Bussiere
Bussiere

Reputation: 1164

button alignign with input

here is my code :

<div class="input-append">

                        <input name="username" maxlength="100" placeholder="Enter your username..." type="text" class="input-large" id="id_username" />


                        <input name="password" maxlength="100" placeholder="Enter your password..." type="password" class="input-large" id="id_password" />

<button class="btn btn-mini">Envoyer</button>
     </div>

here is the result :

here is the result :

how to align the button with the fields please ?

Regards Bussiere

Upvotes: 1

Views: 179

Answers (2)

Landjea
Landjea

Reputation: 384

You will need to set one of the "height" properties on each of them in CSS to get them the same height alignment, if I follow your question properly.

I am not a CSS guru but here is an example that should work :

<style>
.equal_height input, .equal_height button { height: 40px; }
</style>

<div class="input-append equal_height">
     <input name="username" maxlength="100" placeholder="Enter your username..." type="text" class="input-large" id="id_username" />
     <input name="password" maxlength="100" placeholder="Enter your password..." type="password" class="input-large" id="id_password" />
      <button class="btn btn-mini">Envoyer</button>
</div>

Upvotes: 1

Andy
Andy

Reputation: 14575

You could manually set the height to the same value

.input-large,
.btn-mini {
   height: 60px;
}

Upvotes: 1

Related Questions