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

Question

我有一个使用Twitter Bootstrap的传奇的简单表单.我希望能够将这些时间图标放在我正确对齐的传奇词汇旁边.

我尝试了一些像div这样的标签,它将图标推到图例线的底部.我希望这与图例文本对齐.

一个简短的例子.

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

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

提前致谢.

Answer 1

我不确定你为什么要用align="right".问题是你<div>是一个块,它不能与文本保持同一条线.

演示(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%; }