当我注意到推特引导页面在某些情况下似乎"使谷歌Chrome失败"时,我正在通过更改谷歌Chrome窗口大小来玩自适应CSS。
复制步骤(从台式计算机):
- 从一个空白的谷歌Chrome标签开始,全屏
- 访问http://twitter.github.com/bootstrap/
- 逐渐缩小窗口,每100个像素左右放开鼠标一次
- 继续,直到你得到"完全移动版本",大约400px(蓝色的"在github上查看项目"按钮在白色的"下载引导程序"按钮的顶部,它们都是全宽的)
- 现在,使窗口再次变厚,让鼠标每20个像素左右移动一次
在执行第4步或第5步时,你可能会有奇怪的行为——Chrome会对大小感到困惑,或者忘记绘制页面的垂直区域(呈现为白色)。在一些罕见的情况下,我也设法得到了一个"幻影侧窗格"。
我在两台不同的电脑上尝试过,但仍然遇到相同的问题(都使用Ubuntu 12)
问题是,其他响应网站没有这个问题。请参见示例http://css-tricks.com/。你可以随心所欲地改变它的大小,Chrome在呈现它的多个布局时永远不会有任何问题(事实上,它的布局比twitter引导程序更多)。
所以我只能得出结论,这个问题是twitter引导程序特有的。可能与CSS规则或HTML内容的编写方式有关,也可能与文件的结构方式有关。
我正在使用twitter引导程序作为我的一个网站的基础,我想解决这个问题。有人对如何进行有什么想法吗?
如果你认为这是特定于引导程序的,应该将其发布到Twitter引导程序Github页面,而不是SO。然而,我一直在参与一个问题票证注册。在我们指出我们无法在与OP相同的浏览器版本的Chrome/OS X和Chrome/Win 7上复制错误后,该注册被关闭。这表明这是一个特定于平台的chrome错误,而不是Bootstrap工具包的问题。话虽如此,我会向chrome团队提出一张罚单,包括您的构建#和操作系统/平台设置。
Github Issue 的链接