使用Twitter Bootstrap的图例区域中的图标或图标

Question

我有一个简单的表单，其中包含使用Twitter Bootstrap的图例。我希望能够在这个时间点上放置一些东西，在我的传奇词汇旁边，这些词汇是正确的。

我尝试了一些像div这样的标签，然后将图标推到图例线的底部。我希望这与传奇文本保持一致。

一个简短的例子。

    <legend>Contact Categories<div align="right"><i class="icon-comment"></i></div></legend>

这将导致图标一直落在图例线上。传说本身保持原样。

提前致谢。

Answer 1

我不确定为什么要使用align="right"。问题是您的<div>是一个块，它不能与文本保持在同一行。

Demo (jsfiddle)

你必须使它浮动（向右或向左）：

<legend>Contact Categories<div class="pull-right"><i class="icon-comment"></i></div></legend>

或者将其设为内联

<legend>Contact Categories<div id="myBlock" class="inline-block"><i class="icon-comment"></i></div></legend>

.inline-block { display: inline-block; }
#myBlock { text-align: right; width: 30%; }