跨度重叠div

Question

我有这个简单的用户个人资料 - https://jsfiddle.net/mt15199/fgogetrh/ 我想拉左边的信封图标，所以我把它放在span元素上并添加了一个左拉类，但是图标掉落并与容器重叠。没有这个带左拉类的span元素，信封图标和其他图标就位于div内。

我该如何解决这个问题？

                    <span class="pull-left"> 
                <a data-original-title="Broadcast Message" data-toggle="tooltip" type="button" class="btn btn-sm btn-primary"><i class="glyphicon glyphicon-envelope"></i></a>
            </span>

Answer 1

每当您使用float时，请不要忘记使用clear，否则元素会重叠。

请参阅demo

在浮动元素

之后使用clearfix类或clear:both;

使用

<div class="clearfix"></div>

或

<div style="clear:both;"></div>

第一个例子来自第二个中给出相同风格的bootstrap。