Chrome在宽屏显示器上突然改变了网站布局

时间:2017-01-25 14:54:07

标签: html css twitter-bootstrap google-chrome widescreen

上周更新了我的网站设计,并在不同的浏览器和设备上进行了测试 - 这是一个使用Bootstrap的投资组合网站 - 一切都很好。我今天早上在我的宽屏显示器上使用镀铬检查了我的网站,全宽图像似乎缩小了尺寸,在右侧留有余量。

此异常不会出现在不同的浏览器上,甚至不会出现在使用较小屏幕的Chrome上!

该网站正在http://www.burnser.com/index.html

上线

非常感谢任何帮助。谢谢!

1 个答案:

答案 0 :(得分:1)

图像本身仅具有1600px的原生宽度。如果它们应始终全屏显示,则应在您的CSS中加入width: 100%;

.carousel-inner>.item>a>img, 
.carousel-inner>.item>img, 
.img-responsive,
.thumbnail a>img, 
.thumbnail>img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}