php – Bootstrap – 容器流体的对齐问题

前端之家收集整理的这篇文章主要介绍了php – Bootstrap – 容器流体的对齐问题前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我有一个漫画网站,http://hittingtreeswithsticks.com,并希望我的标题保持100%的宽度(所以它在任何浏览器上延伸100%),但我的内容固定宽度(想要保持固定的950px宽度).

因此,我将页眉和页脚放在< div class =“container-fluid”>中.和< div class =“container”>中的主要内容实现这一目标.

我一直在IE9,Chrome和FireFox上进行本地测试,分辨率为1920 x 1080,标题看起来很好.

但是,当我在较小的显示器上测试时,1366 x 768,标题项目似乎在一起.

在header.PHP文件中,我为标题徽标和链接设置(简化)

在header.PHP中,我放了一个开头< div class =“container”>所以包含标题的所有其他模板都将在容器内,而不是容器流体.

有什么想法可能会发生吗?

谢谢!

最佳答案
您没有为内容设置最小宽度,因此浏览器将“糊涂”它以使其适应较小的分辨率.

您可以尝试使用CSS规则,例如

#header { min-width: 1000px; } 

(此处1000px是任意的).这将防止标题包裹到两行,但显然会使其中某些部分位于较小屏幕的可见区域之外.

编辑:如果您提供代码或工作页面链接,我们将能够看到是否存在影响这一点的填充/边距.

猜你在找的CSS相关文章