移动容器时按钮未正确对齐

时间:2017-04-21 09:50:34

标签: html5 css3 asp.net-mvc-5

您好我正在尝试将按钮控件对齐到我的剑道弹出窗口的右下角。

当我设置以下样式时,它显示正常。但问题是当我移动弹出窗口时按钮丢失了。我试图设置相对位置,但它没有显示在底部

enter image description here

.statusButtonAlign{

   position:fixed;
     bottom: 30px;
     right: 20px; 

}


.statusButtonAlign{

       position:absolute;
         bottom: 30px;
         right: 20px; 

    }

形式

<div class="k-popup-edit-form k-window-content k-content "  >
    <div class="k-edit-form-container" >
      @Html.HiddenFor(x => x.CountryCode, new { data_bind = "value: CountryCode" })
        <div class="editor-label">
            @Html.LabelFor(model => model.RequestID)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.RequestID, new { htmlAttributes = new { @readonly = "readonly" } })
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.ProjectName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.ProjectName, new { htmlAttributes = new { @readonly = "readonly" } })
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.RequestStatus)
            </div>
        <div class="editor-field">
                @(Html.Kendo().ComboBoxFor(model => model.RequestStatusCode)

        .HtmlAttributes(new { style = "width:100%" })
        .DataTextField("Status")
        .Placeholder("Select...")
        .DataValueField("RequestStatusCode")
        .AutoBind(false)
        .Filter("contains")

        .DataSource(dataSource => dataSource

        .Read(read =>
        {
            read.Action("GetRequestStatus", "Request").Data("GetCountryCodeFilter").Type(HttpVerbs.Post);

        }).ServerFiltering(true)


           )
                )
            </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.WorkLogDetails)
        </div>

        <div class="editor-field">
            @Html.TextAreaFor(model => model.WorkLogDetails, new { htmlAttributes = new { cols = "100" } })
        </div>

        <div class="statusButtonAlign">
            <button type="submit" class="k-button k-button-icontext k-primary k-grid-update">Update</button>
            <button id="btnClose" type="button" class="k-button k-button-icontext k-grid-cancel">Cancel</button>

        </div>

        <div id="statusMessage">


        </div> 

        </div>

0 个答案:

没有答案