Bootstrap 3 form-control class issue?

Question

I am using twitter bootstrap 3. I have an issue with table colspan attribute in chrome only.As described in the bootstrap documentation that form-control class has 100% width, but when i applied it on the input box inside the colspan 2 than the width of input box is not 100%.

Please check this fiddle (Issue with chrome only)

Whats the wrokaround?

Answer 1

set the containing div width to 100% and it should fix the issue.

<tr>
     <td class="form-group" colspan="2">
       <div class="input-group" style="width:100%;"> <!--------right here-->
       <span class="input-group-addon"><i class="glyphicon glyphicon-envelope">
       </i>
       </span>
       <input type="text" class = "form-control", placeholder = "Email" />
      </div>
     </td>
    </tr>

also, might i ask why you're not using divs with class "rows" and "cols"?