Jeremy
Jeremy

Reputation: 1845

Bootstrap text formatting using input-group and input-group-addon

I have this small problem with the code in this jsfiddle. I am using Bootstrap 3.2.0: bootstrap.min.js and bootstrap.min.css. The code in the jsfiddle is as follows:

<div class="col-lg-6">
  <div class="input-group">
    <span class="input-group-addon">
      <label>
        <input>
      </label>
    </span>
    <label type="text" class="form-control" aria-label="..." >Line 2 hello world this line needs to be very long and this should do it!</label>
  </div><!-- /input-group -->
</div><!-- /.col-lg-6 -->
<div class="col-lg-6">
  <div class="input-group">
    <span class="input-group-addon">
      <label>
        <input>
      </label>
    </span>
    <label type="text" class="form-control" aria-label="..." >Line 2 hello world this line needs to be very long and this should do it!</label>
  </div><!-- /input-group -->
</div><!-- /.col-lg-6 -->
<div class="col-lg-6">
  <div class="input-group">
    <span class="input-group-addon">
      <label>
        <input>
      </label>
    </span>
    <label type="text" class="form-control" aria-label="..." >Line 2 hello world this line needs to be very long and this should do it!</label>
  </div><!-- /input-group -->
</div><!-- /.col-lg-6 -->

This HTML WORKS with bootstrap 3.0.0, but NOT with 3.2.0. SO, here is the SAME HTML in a jsfiddle but with bootstrap 3.0.0. This is how I would like it to look (but I need to use 3.2.0 because I have built my entire project in that so far...)

Any ideas on what the difference is between 3.0.0 and 3.2.0 that is causing this?

Upvotes: 0

Views: 849

Answers (1)

anji
anji

Reputation: 344

try this : http://jsfiddle.net/a4eocgg4/1/

and this in your css:

 .form-control{height: auto !important; }

Upvotes: 1

Related Questions