Html 当我设置了一个浮动时，为什么我的div框向下堆叠？

我在一个webstore上工作，我希望有一个类似于产品的字段，其中包含产品，我希望它们向左浮动，所以当我添加一个产品时，它会与其他产品一起向左浮动

问题

当我添加一个浮动：左它向下堆叠而不是左浮动，我不明白为什么

示例

代码：

。产品库{
保证金：0自动；
宽度：1000px；
列表样式：无；
浮动：对；
位置：相对位置；
}
.产品陈列室李{
浮动：对；
宽度：300px；
右边距：50；
边框：1px实心#999；
}
.product_gallery li img{
宽度：300px；
高度：200px；
浮动：对；
}
.产品说明{
位置：绝对位置；
宽度：300px；
高度：200px；
背景：rgba（0,0,0,0.6）；
不透明度：0；
过渡：0.5s缓进；
}
.product_gallery li:悬停。产品描述{
不透明度：0.7；
}
.产品描述p{
填充：10px；
颜色：#fff；
字号：18px；
}
.产品信息{
高度：40px；
背景：蓝色；
宽度：100%；
浮动：左；
}
.产品信息h4{
浮动：左；
颜色：#fff；
宽度：70%；
利润率：10px；
}
.产品信息跨度{
浮动：对；
颜色：#fff；
保证金：5px；
字体大小：20px；
}
1.现在就买{
背景：蓝色；
颜色：#fff；
宽度：85px；
字体大小：14px；
字体大小：粗体；
文本对齐：居中；
文字装饰：无；
浮动：对；
高度：18px；
}

阿西莫夫
230:-
Awp Asimovär ett fint skin om man gillar att spela Awp:）

如果我真的理解你，你希望你的div是并排的。现在不是了，因为第一个div的宽度是100%，所以第二个div进入下一行

将其宽度减小到一个值，该值可以包含在一行中，并带有div

width:300px