css - 使用 Divs 的带有编辑按钮的堆栈列表

标签 css layout html

我正在尝试使用 DIV 构建堆栈列表 我有 3 个水平显示的 div,但是我希望其中一个 div 类似于一个编辑按钮,无论其他 div 是否始终显示在右上角。这是一个例子。

............................................
| xxxxxxx | xxxxxxxx |编辑 |
...................| |
| xxxxxxx | xxxxxxxx | |
.....................................

所以我可以在左侧添加多行,但编辑按钮将始终位于右上角。我可以使用表格来开发它,但我相信您的 DIV 专家有更好的解决方案。

干杯,

最佳答案

您可以为此使用绝对位置:

例如

CSS:

.parent{
  position:relative;
}
.edit{
 position:absolute;
 top:0;
 left:0;
}

HTML:

<div class="parent">
 <div class="edit"></div>
 <div class="child"></div>
<div class="child"></div>
<div class="child"></div>
</div>

查看这篇文章http://css-tricks.com/791-absolute-positioning-inside-relative-positioning/

关于css - 使用 Divs 的带有编辑按钮的堆栈列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7992005/

相关文章:

java - 安卓自定义 View : MATCH_PARENT with OnDaw don't work

node.js - 显示没有 layout.jade 文件的部分

javascript - 不受控制的输入 React Hooks

jQuery resizable column 增加 table head 超过 20 不合适?

css - 使用通用前缀/后缀简化逗号分隔的 CSS 选择器

javascript - 除了空格之外,TextArea 将换行到哪些字符?

html - 如何并排对齐 facebook 和 twitter 共享按钮?

css - 垂直对齐标记为单选按钮的正确方法是什么

python - 布局更紧凑

HTML Div 不会转到父 div 的底部