CODEWITHSUNDEEP
htmltwitter-bootstrapbutton
Johnrednex
Johnrednex

Reputation: 305

Why doesn't the height modification of the button work?

I'm doing a bootstrap login container. I added a button btn and tried to modify its height. However the height does not change, whatever the value.
The difficulty that prevent me to solve myself the issue is that i only know this attribute to change a button height.

Here is the code for the button :

<button id="btn-login" href="#" class="btn btn-success" style="height: 50%; width: 60%">Inscription</button>

The parent element is:

<div class="col-xs-6">  </div>

You can find a live example of the problem here : http://www.bootply.com/9XnSOvBGOn

Why doesn't the height modification of the button work ?

Thank you.

Upvotes: 0

Views: 106

Answers (3)

hatzaviv
hatzaviv

Reputation: 159

If you wanna make it smaller try using: line-height instead like this:

<button id="btn-login" href="#" class="btn btn-success" style="line-height: 50%; width: 60%">Inscription</button>

or use an absolute height instead of percent.

Upvotes: 2

vaspant
vaspant

Reputation: 65

Your code is correct know. There may be an error in the parent element that contains the button (you work with percentage so it matters). Can you post the parent element?

Upvotes: 0

Lee
Lee

Reputation: 4323

Your style line contains a comma, which is incorrect. It should be a semi-colon. Also, try using pixel values rather than percentages.

<button id="btn-login" href="#" class="btn btn-success" style="height:50px;width:60px">Inscription</button>

Bear in mind that if you are using a percentage for height, you need to set the height of the parent div.

Upvotes: 0

Related Questions