html - How to control form field widths in Bootstrap? -

Looking at the code given below, I am trying to find out how to expand the form field correctly, Then they do. That means almost two bootstrap columns appear in the first two rows, but I hope the third line will be displayed at full width.

  & lt; Div class = "well" & gt; & Lt; Div class = "row" & gt; & Lt; Div class = "col-xs-4" & gt; @HTMLLabelFor (M = & gt; MTO) @HTML Editor (M = & gt; MTO) & lt; / Div & gt; & Lt; / Div & gt; & Lt; Br / & gt; & Lt; Div class = "row" & gt; & Lt; Div class = "col-xs-4" & gt; @htmllabelfor (m = & gt; m.Subject) @HTML editor (m => mbbbb) & lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "row" & gt; & Lt; Div class = "col-md-10" & gt; @HTMLLabelFor (M = & gt; M. Body) @HTML Editor (M => M. Body) & lt; / Div & gt; & Lt; / Div & gt;  

Update ******* ******** This changed to one of the fields

  & lt; Div class = "row" & gt; & Lt; Div class = "col-md-12" & gt; @ Html.TextBoxFor (M => M. Body, new {@ class = "form-control", placeholder = "body"}) & lt; / Div & gt; & Lt; / Div & gt;  

You need to apply the class to your inputs because it determines the input width Does 100% mean that they will fill the columns completely. Unfortunately you do not do this. However, it does:

  @ Html.TextBoxFor (m => m.To, new {@class = "form-control"})