【问题标题】:Bootstrap 3 grid resizing issueBootstrap 3网格调整大小问题
【发布时间】:2014-06-27 23:14:01
【问题描述】:

所以基本上我正在使用 bootstrap 3 构建一个全屏食物图像网格。我使用了 container-fluid 和适当的列来定义我的行和断点的宽度。每列包含一个食物图像并使用类 - col-lg-2 col-md-3 col-sm-4 col-xs-4

我不想要图像之间的间距,所以我删除了分配给列类的左右填充,这给了我想要的确切外观。现在,当我调整网格大小时,一切正常。然而,在屏幕宽度 950px 和 980px 之间,图像在它们之间有一个垂直间距。我不确定是什么原因造成的。有人有想法吗?

我附上了几张图片来说明

http://imgur.com/a/ACSwA

谢谢

编辑:http://www.bootply.com/xXaaLRWKTL - Bootply。在以下示例中,装订线在 991px 宽度左右返回

【问题讨论】:

标签: html css grid twitter-bootstrap-3


【解决方案1】:

我建议使用媒体查询来调整图片之间的间距。

@media (max-width: 978px ){
    div {
        padding-left: 0px ; 
        padding-right: 0px;
    }
}

希望对你有用

【讨论】:

    【解决方案2】:

    我认为排水沟实际上并没有回来。图像已达到其最大宽度/高度,因此不再按比例放大。这个最大 w/h 发生在 Bootstrap 切换到下一个中​​断之前,因此图像之间存在间隙。

    如果您使用最大宽度和高度较大的图像,则不应有间隙。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-04-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-09-26
      • 2017-01-29
      相关资源
      最近更新 更多