Bootstrap3在表格前添加图标

【问题标题】：Bootstrap3 add an icon in front of the tableBootstrap3在表格前添加图标
【发布时间】：2015-12-01 04:24:12
【问题描述】：

我正在尝试在表格前面添加一个图标。

<div class="row">
<div class="col-xs-offset-8 col-xs-4">
    <span class="fa fa-pencil pull-left"></span>
    <table class="table table-condensed table-bordered">
        <thead>
            <th class="text-center">Date</th>
        </thead>
        <tbody>
            <tr>
                <td class="text-center">01/01/2015</td>
            </tr>
        </tbody>
    </table>
</div>

我需要一支铅笔在表格左侧与“日期”在同一行任何帮助将不胜感激

【问题讨论】：

标签： html twitter-bootstrap html-table icons

【解决方案1】：

定位元素的最佳技巧之一是使用top 和position 属性。

为了给铅笔腾出空间，我们在表格中添加了左边距。我们为铅笔提供相对定位，并将其放置在距顶部 20 像素处。

现在它出现在表格的外面和左侧。

.fa-pencil {
  top: 20px;
  position: relative;
}

table {
  margin-left: 20px;
}

http://jsfiddle.net/a00ykzy0/1/

【讨论】：

谢谢，但这不是我需要的。
我需要铅笔在表格边框之外。它假设表明您可以编辑表格。该表有 5 个 td，为了清楚起见，我没有包括在内。
对不起，我太快了。这没用。桌子向右移动并超出“工作区”。你也可以在 jsfiddle 上看到。