CODEWITHSUNDEEP
htmlcssasp.net-mvcasp.net-mvc-4
Thierry
Thierry

Reputation: 6457

Stretching a textbox in a Form in ASP.NET MVC5

Can someone please explain to me why my textbox is not streching?? I've spent a ridiculous amount of time on this and I'm obviously missing something.

I've looked at various answers on SO and other website but to no avail. I've tried changing attributes in using style, but again no luck!

I found an article on SO but can't find it now, but I do have the sample that was provided: resize example and the article stated that you could simply set the width:100% in style, but even looking at this example is driving me nuts as both lines are stretching 100%, yet only one of them has it width set to 100%

@using System
@model MyCompany.Models.ApplicationFormModel

@{
    ViewBag.Title = "Application Form";
}

@*<h2>ApplicationForm</h2>*@

<div class="row">
    @*<div class="col-sm-6">*@
    <div class="well bs-component">
        @using (Html.BeginForm("ApplicationForm", "Registration",
                FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
            {
            @Html.AntiForgeryToken()
            <fieldset>
                <legend>Application Form</legend>
                @Html.ValidationSummary(true, "", new { @class = "text-danger" })

                <div class="form-group">
                        @Html.LabelFor(model => model.Name, 
                        new { @class = "control-label col-sm-2" })
                    <div class="col-sm-10">
                        @Html.TextBoxFor(model => model.Name, 
                        new { @class = "form-control", style = "width:100%" })
                        @Html.ValidationMessageFor(model => model.Name, "",
                        new { @class = "text-danger" })
                    </div>
                </div>

                <div>
                    <div class="form-group">
                        <div class="col-md-offset-2 col-md-10">
                            <input type="submit" value="Save" class="btn btn-primary" />
                        </div>
                    </div>
                </div>
            </fieldset>
            }
    </div>
    @*</div>*@
</div>

Upvotes: 0

Views: 539

Answers (1)

vscorp1991
vscorp1991

Reputation: 42

Look in Site.css

There probably you will find next lines

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

Upvotes: 1

Related Questions