html - Bootstrap 跨度问题

Question

我正在使用 twitter 作为 Bootstrap 制作一个小 vCard，我遇到了一个小问题，我无法追踪它的来源:)

如果您点击此链接:Demo ;您会看到元素有些困惑 :) 在 vCard 的标题中，联系信息应该位于姓名和拇指的右侧，但它被推到了下面。小描述也是如此:)

使用 row-fluid 而不是 row 可以解决这个问题，但是因为我的移动版本不需要流畅，所以我不能使用流畅的网格。我希望有人以前遇到过这个问题并且知道它的根源是什么:)

Answer 1

如果你真的想让它在移动设备上很好地工作，你真的应该考虑 content-view-container 类的 css 属性:你有绝对定位和固定值宽度当您想针对“任何”屏幕尺寸进行设计时，效果不佳...

代码中存在一些问题:

• 首先 span2 和 span12 不应该是“pulled-left”(类名中也有错别字)和“pulled” -right”(它使“网格”的含义变得无用...)

• info-button-container的所有样式都是多余的(只保留margin-top)

• 在 info-button-inner 中为什么要使用 border-box 属性？用line-height属性固定中间播放图标的位置

• 为什么要将所有的div设置为position:relative;显示: block ；？这里没用...

• row 不需要类 clearfix 因为它已经是“clearfixed”