浮动 Div 不工作答案

【问题标题】：Floating Div is not working浮动 Div 不工作
【发布时间】：2014-05-07 09:52:26
【问题描述】：

我正在尝试添加包含删除按钮的浮动 div 标签。它不工作。我正在使用 struts1.X 和瓷砖。

我的网页使用 3 个 jsp 构建：Menu.jsp、Body.jsp、Fotter.jsp。我正在尝试添加新的浮动删除按钮。

我的 CSS 文件，在我的 CSS 中，我添加了 2 个浮动样式。

div.floatingBtn {
  width: 350px
  position: fixed;
  top: 90%;
  left: 34%;
  padding: 10px;
  z-index: 100;
  }

div.flating {
  position: fixed;
  border: 1px solid black;
  paddding: 2px;
  width: 400px;
  height: 400px
  z-index:100;
}

我的 body.jsp：

<div class="flating"><table align="center"><tr><td>
<button id="DELETE" class="btn" onclick="deleteDocs();" >Delete</button></td></tr></table>
</div>

我尝试了这两种样式，但它们都不起作用。为什么？

【问题讨论】：

很可能您的按钮没有floatingBtn 类，否则您的浏览器可能不支持position: fixed;。
我已将我的 floatingBtn 样式赋予我的 DIV 标签。我用的是ie8，
尝试将您的 css div.floatingBtn 更改为 #DELETE 以进行参考。根据caniuse.com/#search=fixedpostion:fixed 应该可以在 ie8 上工作

标签： html css jsp css-float jsp-tags

【解决方案1】：

第一个 CSS 在您的 html 中没有任何影响，因为您的 HTML 不包含 CSS-Class "floatingBtn" 中的任何内容。

其次，您的 CSS 没有任何 float: 规则。这是因为你没有得到任何浮动元素。

如果您想要固定定位 - 这与浮动完全不同！ -，您还必须设置它的位置（在 div.flating 规则中添加 left: 和 top:）。

【讨论】：

我也尝试过使用“floatingBtn”。它不工作。我已将左上角添加到平坦其不工作的位置。
@sarmachinta 它必须。您可能还有其他问题。显示一个 jsfiddle。