twitter-bootstrap 在引导行右侧显示删除按钮，悬停
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26632713/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Show Delete Button On Right Side Of Bootstrap Row, On Hover
提问by Brian Mains
I saw a lot of examples of popping up a delete button over a container. I want to show over a Twitter Bootstrap row, on the right side of the row.
我看到了很多在容器上弹出删除按钮的例子。我想在行的右侧显示 Twitter Bootstrap 行。
<div class="row">
<div class="col-md-4">
Content
</div>
<div class="col-md-4">
Content
</div>
<div class="col-md-4">
Content
</div>
</div>
A lot of the samples involved using a relative position on the container; however, I don't want to mess with the existing table display on the .row, so is there a better way of doing that on popup for a twitter bootstrap row?
许多样本涉及使用容器上的相对位置；但是，我不想弄乱 .row 上现有的表格显示，那么有没有更好的方法在 twitter 引导行的弹出窗口中做到这一点？
EDIT: I'd like to show a button on the right, centered in the row. A button with the following markup:
编辑：我想在右边显示一个按钮，在行中居中。带有以下标记的按钮：
<button ..><i class="icon-remove-sign"></i></button>
Which shows only on hover.
仅在悬停时显示。
回答by Sebsemillia
Try the following code:
试试下面的代码：
HTML:
HTML：
<div class="row">
<div class="col-md-4">
Content
</div>
<div class="col-md-4">
Content
</div>
<div class="col-md-4">
Content
</div>
<div class="hover-btn">
<button type="button" class="close" data-dismiss="alert">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
</div>
</div>
CSS:
CSS：
.row {
position: relative;
}
.hover-btn {
position: absolute;
right: 15px;
display: none;
}
.row:hover .hover-btn {
display: block;
}
