CODEWITHSUNDEEP
formstwitter-bootstrapresponsive-designtextinput
Julian
Julian

Reputation: 11

Making input text responsive

I need to make the text input field in responsive. Currently, it matches width of other input elements, but when I decrease my screen size, the input field does not respond accordingly. 

<div class="col-sm-12">
<div class="col-sm-8">
<table border="0"  id="dynamic_field">  
          <tr>  
          <td><input type="text" placeholder="Digite o link da arquitetura" class="form-control"
            id="txt-link[]" name="txt-link[]" value="{{old('txt-link[]')}}" style="width: 730px;">
            @if($errors->has('txt-link.0'))
              @foreach ($errors->get('txt-link.0') as $message)
                <span class="help-block" style="margin-top:5px; margin-bottom:-5px; color:rgb(170, 56, 56)"><b>{{  $message }}</b></span>
              @endforeach  
            @endif  </td>  
            <td><button type="button" name="add" id="add" 
            <a class="btn btn-primary"><i class="fa fa-plus"></i>
            </a></button></td>  
                </tr>  
          </table>  
</div>
</div>

Upvotes: 0

Views: 124

Answers (1)

Mr. Perfectionist
Mr. Perfectionist

Reputation: 2746

You should not fixed your width. Remove style="width: 730px;"

You have to give your table width 100%. In Bootstrap 4 there is a class w-100 to do that.

<table border="0"  id="dynamic_field" class="w-100"> 
----
</table>

I think it will solve your problem.

Upvotes: 1

Related Questions