Css Div在IE中没有正确对齐-在Firefox/Chrome中工作正常

我正在尝试将行div中的products div与行div中的4对齐，以使其看起来像一个购物网站，它在Chrome和Firefox上运行良好，但似乎在中间重叠，超出了它应该保持的div。我已经尝试了很多解决方案，但都没有奏效，所以我需要帮助

CSS

---

products1是一个div容器，可容纳其中的4个产品，产品是其中的4个盒子，但只有它在IE中不起作用

添加浮动：左；inside.product{}

顺便说一句，你没有提到IE的哪个版本

#products1 {
width:1000px;
height:320px;
margin:auto;
margin-top:10px;
margin-bottom:15px;
position:relative;
display:inline-block;
}

.product {
margin:auto;
height:320px;
width:230px;
border:1px solid #d9d9d9;
position:relative;
box-shadow: 0 0 5px #BBB;
display:inline-block;
}