Bootstrap : align button text left

Question

How can I align text to the left within a bootstrap button? I have multiple buttons with text of varying length, and all the button need to have same width. I have achieved this using the class col-xs-11.

Sample button code below:

<input type="button" value="Applicant/Subsidiary" id="mybutton" name="test" class="primary-btn col-xs-11"> 

Is it possible to achieve this without creating a custom style, other than what is provided by bootstrap? I'm using Bootstrap v3.0.1

Answer 1

just add text-left class

<input type="button" value="Applicant/Subsidiary" id="mybutton" name="test" class="primary-btn col-xs-11 text-left"> 

Answer 2

The issue is not how to css text-align to the left, the original post was asking if there is a bootstrap class name(s) works for it.

The .text-left works, but the trouble is there is a .btn that is stronger than text-left, I think this is something bootstrap need to think about.

Checkout this screenshot that I did a test with Chrome inspect on Bootstrap's site.

In my Chrome, I add "text-left" on the demo button, and this is the result. Therefore, have !important on it!

.text-left {   text-align: left !important; }