0

这是 plunker - http://plnkr.co/edit/iwvjJcUurUW2AvkDArfz?p=preview

问题是当我将鼠标悬停在每一行上时，列向左移动，这是不可取的。

我希望图标在鼠标悬停时出现和消失，但表格列不会改变它们的位置

我怎样才能做到这一点？

谢谢

4

4 回答 4

1

只需修复您的CSS：-

tr i.icon-minus-sign {visibility: hidden;}
tr:hover i.icon-minus-sign {visibility: visible;}

问题是您最初有一个没有任何元素的列，因为它是display:none您的其他单元格扩展占用空间。当您将鼠标悬停在元素上时，会占用空间并且缩小的 td 会展开。为避免这种情况，最好的方法是使用visibilitywhich 占用元素空间，即使它隐藏了不同的display属性

于 2013-05-15T04:47:29.793 回答
0

再加一个th和

<th>&nbsp;</th>

提示：为所有列分配宽度并关闭</thead>

<table class="table table-hover" style="width:100%">
  <thead>
    <tr>
       <th style="width:60%" >Name</th>
       <th style="width:30%">Amount</th>
       <th style="width:10%">&nbsp;</th>
    </tr>
  </thead>

Working Fiddle

于 2013-05-15T04:45:25.597 回答
0

我在这里得到了这个是解决方案width并th添加一个空白th

<th width="100px">Name</th>
<th width="300px">Amount</th>
<th width="100px">&nbsp;</th>

您可以根据需要修改宽度，这将对您有所帮助。

于 2013-05-15T04:45:55.397 回答
0

我刚开始使用 CSSvisibility属性

这是更新的 plunker - http://plnkr.co/edit/iwvjJcUurUW2AvkDArfz?p=preview

这是对我的 css 所做的所有事情

tr i.icon-minus-sign {visibility: hidden;}
tr:hover i.icon-minus-sign {visibility: visible;}
于 2013-05-15T04:47:26.647 回答