0

我将我的主 div 定位到0 auto;并且仍然有右边距我应该怎么做才能删除它？

这是小提琴的例子：http: //jsfiddle.net/sz3MD/9/

body  {
       margin: 0;
       padding: 0;
       background: #EEE;
       font: 10px/13px 'Lucida Sans',sans-serif;
    }

    .wrap {
       overflow: hidden;
       margin: 10px;
       background-color: #fff;
       margin: 0 auto;
    }

    .box {
       float: left;
       position: relative;
       width: 14%;


    }

    .boxInner img {
        background-color: black;
       width: 100%;
       display: block;
       -webkit-filter: grayscale(100%);
       -moz-filter: grayscale(100%);
       -o-filter: grayscale(100%);

    }
4

2 回答 2

1

@beautifulcoder 解决方案很好，但不太正确。这个问题与.wrap边距或填充无关，“右边距”实际上是.wrap内容的一部分。

网格中有 16 个元素，如果你以 7 个元素（每行）的百分比计算总宽度.box，每个元素有 14% 的宽度，结果是 98%，所以总宽度的 2% 剩余宽度就是你调用“右边距”，这实际上是元素内容的一部分。

如果你使用 14.25% 仍然有一点空白，所以你应该使用14.285714286%（100/7 的结果）代替14%or14.25%来解决问题。CSS 允许您使用这样的大数字而不会出现问题，因此不必担心大小。

也不要使用margin: 0 0 0 auto。正如我刚刚解释的那样，这不是保证金问题，因此您不需要此属性。除非您指定宽度，否则您甚至可以删除该属性margin: 0 auto，因为环绕的宽度是 100%，它永远不会有边距。

这是一个示例来演示两者之间的差异

.wrap {
    width: 80%;
    margin: 0 0 0 auto;
}

.box {
    width: 14.25%;
}

和

.wrap {
    width: 80%;
    margin: 0 auto;
}

.box {
    width: 14.285714286%;
}
于 2013-11-09T17:10:10.620 回答
1

尝试

.wrap {
  margin: 0 0 0 auto;
}
.box {
  width: 14.25%;
}

这个想法是扩大框宽度并设置边距以使其“出现”而没有右边距。

http://jsfiddle.net/sz3MD/10/

于 2013-11-09T14:32:27.623 回答