Diskuze: pozice @Html.EditorFor a velikost

Martin

Člen

Martin:23.2.2018 5:41

Ahoj, mam uplne defaultni stranku index, ale chci aby editorfor byl na stredu stranky a ne nalevo.
Dal bych ho chtel mnohem delsi (treba 60em). Fakt uz si nevim rady. Je to urcite nejaka blbost.

Dekuji M.

@model WebApplication1.Models.Class1

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>


@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Class1</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.UString, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.UString, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.UString, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>

}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Odpovědět

23.2.2018 5:41

Fenrix

Člen

Fenrix:23.2.2018 7:27

podívej se jak funguje v bootstrapu grid systém -> https://getbootstrap.com/…layout/grid/
takže pokud do toho nechceš tahat čistý css a udělat to pomocí gridu, tak by to mohlo jít třeba nějak takhle:

@model WebApplication1.Models.Class1

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>


@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
<div class="container">
<div class="row">
<div class="col-md-4 offset-md-4>
    <div class="form-horizontal">
        <h4>Class1</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.UString, htmlAttributes: new { @class = "control-label col-md-2" })

                @Html.EditorFor(model => model.UString, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.UString, "", new { @class = "text-danger" })
            </div>
        </div>
</div>
</div>
<div class="row">
<div class="col-md-4 offset-md-4">
        <div class="form-group">

                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
</div>
</div>
    </div>

}
</div>
<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Editováno 23.2.2018 7:29

Nahoru Odpovědět

23.2.2018 7:27

Fenrix

Člen

Fenrix:23.2.2018 7:31

za správnost neručim, je brzo ráno a nechce se mi v nějakym editoru kontrolovat jestli sedí uzavření divů ale pro představu

Nahoru Odpovědět

23.2.2018 7:31

Martin

Člen

Martin:23.2.2018 8:33

A to je presne ono, takhle to prave nejde
Takovyhle podobych vysledku jsem se dobral taky
Ty webovky jsem nasel taky ale proste mi to podle toho nefunguje
Asi jsem jelito, ale s tim se nehodlam smirit

Nahoru Odpovědět

23.2.2018 8:33

Michal Štěpánek

Člen

Michal Štěpánek:23.2.2018 9:29

Zkus se mrknout na "flexbox", to by ti mohlo pomoci
https://css-tricks.com/…-to-flexbox/

Editováno 23.2.2018 9:30

Nahoru Odpovědět

23.2.2018 9:29

Nikdy neříkej nahlas, že to nejde. Vždycky se totiž najde blbec, který to neví a udělá to...

Fenrix

Člen

Fenrix:23.2.2018 13:58

<div class="container">
    <h2>Index</h2>
    @using (Html.BeginForm())
    {
        <div class="row">
            <div class="col-lg-3"></div>
                <div class="form-horizontal">
            <div class="col-lg-9">
                @Html.AntiForgeryToken()
                    <h4>Class1</h4>
                    <hr />
                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                    <div class="form-group">
                        <div class="col-lg-1">
                            @Html.LabelFor(model => model.UString, htmlAttributes: new { @class = "control-label" })
                        </div>
                        <div class="col-lg-11">
                            @Html.EditorFor(model => model.UString, new { htmlAttributes = new { @class = "form-control" } })
                            @Html.ValidationMessageFor(model => model.UString, "", new { @class = "text-danger" })
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-5"></div>
            <div class="col-lg-7">
                <div class="form-group">

                    <input type="submit" value="Create" class="btn btn-default" />

                </div>
            </div>
        </div>
    }

    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>
</div>

tohle je funkční a máš to na prostředku pomocí gridu, nedělal jsem to pomocí offsetu at je to zřetelný

Akceptované řešení
+20 Zkušeností
+2,50 Kč

Nahoru Odpovědět

23.2.2018 13:58

Martin

Člen

Martin:23.2.2018 17:22

Výborně, velice děkuji,
podívám se na to a použiju to tam kde jsem potřeboval. Tohle mi hodně pomohlo, děkuji

Nahoru Odpovědět

23.2.2018 17:22

Naučíme tě pracovat na home-office.

Zjistit více...

Naučíme tě pracovat na home-office.

Více info »

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 7 zpráv z 7.