に私は、次のレイザービュー私はブートストラップの最新バージョンを使用中心に2つの列(ブートストラップ)
<div class="container">
<div class="row well">
<div class="col-md-4 col-md-offset-4">
<h2>Create</h2>
<h4>Create Advert</h4>
</div>
</div>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="text-danger">@ViewBag.Message</div>
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-5">
<div class="form-group">
@Html.LabelFor(model => model.Title, htmlAttributes: new { @class = "control-label col-md-2 " })
<div class="col-md-8">
@Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Country, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("CountryDropDown", null, htmlAttributes: new { @class = "form-control", @id = "Country" })
@Html.Hidden("Countries", null, htmlAttributes: new { @class = "form-control", @id = "HiddenCountry" })
@Html.ValidationMessage("CountryDropDown", "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Subregion, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Subregion, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Subregion, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Price, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Price, new { htmlAttributes = new { @class = "form-control" } })
@Html.CheckBox("PriceCheck", isChecked: false) @Html.DisplayName("Price negotiable")
@Html.ValidationMessageFor(model => model.Price, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.BuildingFloorsId, "Floors", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("FloorsDropDown", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.BuildingFloorsId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Area, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Area, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Area, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("TPP", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Area, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Area, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Type of construction", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Interior, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Interior, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Exterior, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Exterior, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Exterior, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="col-md-5">
<div class="form-group">
@Html.LabelFor(model => model.AdvertisementCategoryId, "Category", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("AdvertisementCategoryId", null, htmlAttributes: new { @class = "form-control", @id = "ddlProductCategory" })
@Html.ValidationMessageFor(model => model.AdvertisementCategoryId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.State, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("StateDropDown", null, htmlAttributes: new { @class = "form-control", @id = "State" })
@Html.Hidden("States", null, htmlAttributes: new { @class = "form-control", @id = "HiddenState" })
@Html.ValidationMessage("StateDropDown", "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Address, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Address, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Address, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Currency", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("Currency", null, htmlAttributes: new { @class = "form-control", @id = "Currency" })
@Html.Hidden("Currencies", null, htmlAttributes: new { @class = "form-control", @id = "HiddenCurrency" })
@Html.ValidationMessage("Currency", "", new { @class = "text-danger" })
</div>
</div>
<br>
<div class="form-group">
@Html.LabelFor(model => model.FloorId, "Floor", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("FloorDropDown", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.FloorId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.TelephonNum, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.TelephonNum, new { htmlAttributes = new { @class = "form-control", @id = "TelNum" } })
@Html.ValidationMessageFor(model => model.TelephonNum, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.RoomsNumber, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.RoomsNumber, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.RoomsNumber, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Interior, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Interior, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Interior, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="col-md-1"></div>
</div>
<div class="row">
<div class="col-md-4 col-md-offset-4">
<div class="form-group">
<img src="@Url.Action("GetCaptchaImage","Captcha")" style="width:300px;" />
</div>
<div class="form-group">
@Html.Label("Enter Code", new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.TextBox("CaptchaText", "", new { @class = "form-control" })
</div>
</div>
</div>
</div>
<div class="row">
<div class="form-group">
<div class="col-md-4 col-md-offset-4">
<input type="submit" value="Create" class="btn btn-default" style="width:300px;" />
</div>
</div>
</div>
</div>
}
を持っています。そのコードを実行すると、結果は良くありません。 列と行が中央揃えされていません。ラベル付きの入力フィールドはブロック要素で、クラス名は「text-center」は機能しません。私は "ブロックセンター"で何もしなかった。私もオフセットを試みました。あなたはいくつかのアイデアを持っているなら、素晴らしいでしょう。
だあなたは私達にあなたを表示することができます出力HTML、それは私たちが修正できるもののより良い表現になるでしょう。すぐに私は '.row'と' .well'を組み合わせるようなBootstrapフレームワークのいくつかの問題を見ています。あなたは '.row'や' .col - * - * 'の中にフォーム自体を持っていません。正しくセンタリングしていません...等 –