html - Bootstrap 3 - 重叠内容(Clearfix？)

Question

我的 HTML (Bootstrap) 中有一个问题，即三列页脚在大多数桌面上显示正常，但在较小的屏幕尺寸(平板电脑/移动设备)上折叠/重叠。

我使用 float: left;对于几个页脚元素 - 也许是相关的。

我可以用 <div class="clearfix"></div> 修复它在有问题的元素之后，但这会破坏桌面上的三列布局。

我错过了什么？

截图:

例子:

http://www.bootply.com/YRCLoHI7Uw

Answer 1

你的代码有问题

问题:

您正在使用 px同时给予width , padding和 margin到 <address>和 .box .

解决方法:

您应该始终使用%或 em在进行响应式设计的同时。 %对于 width和 em对于 padding和 margin因为%和 em将根据width展开和收缩.