Question

我正在尝试创建单个像素边框同位素布局，没有左右外边框。如果您查看以下网址：

你会看到我非常接近，只是有些边界没有按照它们应该排列。

到目前为止，这是LESS / CSS：

* {
          box-sizing: border-box;
}

body {
  font-family: sans-serif;
}


/* ---- grid ---- */

.grid {
  background: #DDD;
  position:relative;
  border-top: solid 1px #fff;
  border-top: 1px solid #333;
  overflow: hidden;

  &-item {
  padding: 20px;
  background-color: #ccc;
  width: 25%;
  width: ~"calc(25% + 2px)";
  height: 350px;
  border: 1px solid #333;
  border-top: 0;
  margin-right: -1px;
  margin-left: -1px;


    &:last-child {
      border-bottom: 1px solid #333;
    }
}

}


.grid-item--height2 { height:450px; }

和JS

$(function() {

  $('.grid').isotope({
    layoutMode: 'packery',
    itemSelector: '.grid-item',
    packery: {
      gutter: 0
    }
  });

});

Answer 1

添加保证金：0到正文;

 SELECT p.PRODUCT_NAME, p.PRODUCT_ID FROM NIRD_Product_Groups p

具有单像素边框的同位素布局

1 个答案: