当我注意到 Twitter Bootstrap 页面在某些情况下似乎“使 google chrome 失败”时,我正在通过更改我的 Google Chrome 窗口大小来使用自适应 CSS。
重现步骤(从台式计算机):
- 从一个空白的谷歌浏览器标签开始,全屏
- 访问http://twitter.github.com/bootstrap/
- 逐渐使窗口变窄,每 100 像素左右松开鼠标。
- 继续前进,直到获得大约 400 像素的“完全移动版本”(蓝色的“在 github 上查看项目”按钮位于白色“下载引导”按钮的顶部,它们都是全角的)。
- 现在再次使窗口变厚,让鼠标每 20 像素左右移动一次。
在执行第 4 步或第 5 步时,您可能会遇到奇怪的行为 - Chrome 对尺寸感到困惑,或者忘记绘制页面的垂直区域(呈现为白色)。在极少数情况下,我还设法获得了“幻像侧窗格”。
我在两台不同的计算机上尝试过,但仍然遇到同样的问题(都使用 Ubuntu 12)
问题是,其他响应式网站没有这个问题。参见例如http://css-tricks.com/。你可以随心所欲地改变它的大小,Chrome 在渲染它拥有的多个布局时从来不会遇到任何问题(事实上,它的布局比 twitter bootstrap 多)。
所以我只能得出结论,这个问题是 twitter-bootstrap 特有的。可能与 CSS 规则或 HTML 内容的编写方式有关,或者可能与文件的结构方式有关。
我正在使用 twitter bootstrap 作为我的一个网站的基础,我想解决这个问题。有没有人对如何进行有任何想法?