How to set width of a button bootstrap - html

Question

How to set custom width of a bootstrap button.
My problem is that I don't know how to shrink width of button to like on the image (it's a submit button). Left part is input text. My problem is button is too wide. Here is the code:
<div class="col-xs-5 col-xs-offset-3">
<div class="input-group input-group-lg">
<input type="text" class="form-control input-lg input-forme" id="Text" placeholder="Text">
<span class="input-group-btn tipka">
<button type="submit" class="btn btn-group-small" id="form-submit">Submit</button>
</span>
</div>
</div>

Answer 1

You can change width and padding : https://jsfiddle.net/wz8ac5d4/
.btn {
width:0px;
padding:5px;
}
Also you can add a class to your btn, it is a better practice.
HTML:
<button type="submit" class="btn btn-group-small my-small-btn" id="form-submit">Submit</button>
CSS :
.my-small-btn {
width:0px;
padding:5px;
}

Answer 2

The classes that define the different sizes are:
.btn-lg
.btn-md
.btn-sm
.btn-xs
refer this link
http://www.w3schools.com/bootstrap/bootstrap_buttons.asp

Answer 3

You can increase its size with this:
.btn {
width: 100%;
padding: 5px;
}

Answer 4

I used max-width with padding.
HTML
<button type="submit" class="btn custom-btn" id="form-submit">Submit</button>
CSS
.custom-btn {
max-width: 100%;
padding-left:25px;
padding-right:25px;
}
You can also just shortcut the padding.
.custom-btn {
max-width: 100%;
padding: 6px 25px;
}
Just adjust the 25px to whatever length you want to get the appropriate size.
Please note that 6px is the standard top and bottom padding for a medium bootstrap button. You will have to adjust accordingly for large and small buttons.