html5 - width not applying for text area MVC -
the width isnt setting textarea control. sets other controls. tell me why isnt width applying text area
for example
setting border solid col-md-6
<div class="form-group"> @html.labelfor(model => model.projectname, htmlattributes: new { @class = "control-label col-md-5" }) <div class="col-md-6"> @html.editorfor(model => model.projectname, new { htmlattributes = new { @class = "form-control", style = "width:100%" } }) @html.validationmessagefor(model => model.projectname, "", new { @class = "text-danger" }) </div> </div> <div class="clearfix"></div> <div class="form-group"> @html.labelfor(model => model.projectsummary, htmlattributes: new { @class = "control-label col-md-5" }) <div class="col-md-6"> @html.textareafor(model => model.projectsummary, new { htmlattributes = new { @class = "form-control", rows = "3", style = "max-width:100%" } }) @html.validationmessagefor(model => model.projectsummary, "", new { @class = "text-danger" }) </div> </div>
the real width width textarea has. col-md-6
make wide. problem container you're applying border not constrain textarea. if understand correctly you're applying border div col-md-6
class, issue. grid classes boostrap employ various width, margin , padding settings construct grid close cross browser possible, , applying actual visible style them causes weirdness this. instead, wrap textarea div , apply border that:
<div class="col-md-6"> <div class="my-awesome-border"> @html.textareafor(model => model.projectsummary, new { htmlattributes = new { @class = "form-control", rows = "3", style = "max-width:100%" } }) @html.validationmessagefor(model => model.projectsummary, "", new { @class = "text-danger" }) </div> </div>
long , short, should avoid adding additional style bootstrap's grid classes (col-*, row, etc.).
Comments
Post a Comment