Question

我试图让一个图标与Bootstrap中的一个段落并排显示。正如您在此fiddle中看到的那样，图标显示在段落上方。

这是我的标记：

<div class="row-fluid">
    <div class="span1"><p class="icon"><i class="glyphicon glyphicon-hand-right"></i></p></div>
    <div class="span11"><p class="text"><strong>Teacher Management:</strong> Here you can manage the details belongs to the teacher, by clicking the link "Teacher Management" you can view the table displaying all the teachers minimum information. The "Create New" link just above the table allow you to fill up new teacher information and the links available in the table like view, edit and delete allow you to view detailed information, to update/edit the information, to delete the information respectively.</p></div>
</div>

我想将段落放在手形图标的右侧;我该怎么办？

Answer 1

Demo Fiddle

您可以简单地使用：

.span1{
   float:left;
}

More on CSS float from MDN

float CSS属性指定应该从中获取元素正常流动并沿其左侧或右侧放置容器，其中文本和内联元素将环绕它。一个浮动元素是float的计算值不是none的那个。

作为上述内容的补充，如果您已经使用 Bootstrap ，只需将课程pull-left添加到span1（{{3 }}，或使用xs-列（Demo）

Answer 2

您可以使用Bootstrap（因为您正在使用它）col-xx-xx类来执行此操作。

Demo Here

<div class="span1 col-xs-1">
<div class="span11 col-xs-11">

Bootstrap使用12列系统，因此使用1和11将使您的图标1列和文本内容成为剩余的11列，并排。

Answer 3

如果您想要完美对齐，请使用表格并将文本对齐

Demo

 <table id="tab">
    <tr>
        <td> div1 </td>
        <td> div2 </td>
   </tr>       
 </table>

Answer 4

你也可以使用bootstrap类

<div class="row-fluid col-xs-12">
            <div class="span1 col-xs-1"><p class="icon"><i class="glyphicon glyphicon-hand-right"></i></p></div>
            <div class="span11"><p class="text"><strong>Teacher Management:</strong> Here you can manage the details belongs to the teacher, by clicking the link "Teacher Management" you can view the table displaying all the teachers minimum information. The "Create New" link just above the table allow you to fill up new teacher information and the links available in the table like view, edit and delete allow you to view detailed information, to update/edit the information, to delete the information respectively.</p></div>
</div>

Css用于并排显示两个元素

4 个答案:

Demo Fiddle