NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
Martin
Člen
Avatar
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
Avatar
Fenrix
Člen
Avatar
Odpovídá na Martin
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
Avatar
Fenrix
Člen
Avatar
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ů :D ale pro představu

 
Nahoru Odpovědět
23.2.2018 7:31
Avatar
Martin
Člen
Avatar
Odpovídá na Fenrix
Martin:23.2.2018 8:33

A to je presne ono, takhle to prave nejde :D
Takovyhle podobych vysledku jsem se dobral taky :D
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
Avatar
Odpovídá na Martin
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...
Avatar
Fenrix
Člen
Avatar
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č
Řešení problému
 
Nahoru Odpovědět
23.2.2018 13:58
Avatar
Martin
Člen
Avatar
Odpovídá na Fenrix
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
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.