时间戳

首页 > 解决方案 > jquery modal dialog button div没有右对齐-css使其占据总行

jquery - jquery modal dialog button div没有右对齐-css使其占据总行

问题描述

我是样式表的新手，需要以下帮助。我的 JSP 代码使用类似于来自https://jqueryui.com/dialog/#modal-form的演示的模态对话框示例 我使用的是来自该网站的相同 CSS 和 JS、jquery 库。我有一个要求，在 DIV 中，我必须在右侧有一个按钮来“添加”（leftdiv）和右侧的分页（rightdiv）。该按钮将从上面的开源打开一个模式对话框并使用它的 CSS。右侧对齐使用我的 CSS 并且工作正常，但是应该左对齐的模式按钮是向右的。当我在 chrome 中检查时，父 div 在 2 个不同的行中显示 2 个 DIV。第一行包含左侧 div，第二行包含右侧 Div。

<div><div class="LeftAlign">
<button id="create-user">Add</button>
</div>
<div class="RightAlign">Pagination</div>
</div>

当我检查按钮持有这个类=“ui-button ui-corner-all ui-widget”。我应该如何在代码中解释这一点。如何更改我的 CSS 以使按钮左移和分页在单行中右对齐。提前致谢。

标签： jquerycssmodal-dialog

解决方案

给显示：flex；样式到您的父 div 例如：-

.first {display:flex;}
.RightAlign { margin-left: auto;}

所以 HTML 将是：-

<div class="first">
  <div class="LeftAlign">
    <button id="create-user">Add</button>
  </div>
  <div class="RightAlign">Pagination</div>
</div>

推荐阅读