html - Bootstrap 跨度问题

标签 html css twitter-bootstrap

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

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

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

最佳答案

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

代码中存在一些问题:

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

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

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

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

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

关于html - Bootstrap 跨度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13469518/

相关文章:

html - @supports 规则如何支持此语句中的动画名称?

javascript - 无法隐藏 <em>-Element,它在 Javascript 中作为 String 添加; textContent 不隐藏

jquery 滚动条 |样式标签与样式属性

javascript - 防止页面在折叠的 Accordion 部分上向上滚动。 Bootstrap 4

html - 清空 HTML5 Canvas 的正确方法是什么?

css - 如何防止div侧边栏重叠内容?

CSS:显示宽度为 "inline"的元素

javascript - 如何避免模态对背景内容的影响?

html - 位置固定后停止重叠

internet-explorer - 如何在 IE10 中通过 iframe 强制 Bootstrap 下拉菜单