Html Can'；我不明白是什么使div中的内容向下滑动

代码（HTML/CSS）：

我无法找出代码中导致以下产品单元设计异常的问题

产品标题

，

产品说明

，

产品图片

（1 2 3 4链接）应该在小图片的左侧，而不是下方

产品价格

和

状态

有关项目是否有库存的信息应位于

产品标题

、

产品说明

和

产品图片

的左侧。相反，它是不可见的

当您将鼠标悬停在链接1、2、3或4上时，由于某种原因弹出的窗口会拉伸整个

产品单元格

div，您无法看到整个图像

有人知道这里可能出了什么问题吗？很多事情

1<代码>产品标题，

产品说明

，

产品图片

（1 2 3 4链接）

让我们先来谈谈你的产品形象。您说过希望产品标题等显示在其左侧，这意味着产品图像需要向右浮动，而不是向左浮动

 #product_cell img {  float:right;  border: 1px solid #80889D; margin-right: 8px; }

浮动这两种方法都会产生问题，我不确定是否有必要这样做，所以让我们解决这个问题：

 #product_cell .product_info{ }

---

2<代码>产品价格和状态

这些项目不会显示，因为正在对它们应用

.thumbnail span

和

.thumbnail:hover span

（除非悬停在上方，否则它们是隐藏的）。这是因为错误的标记

• 添加结束标记

项目2-4缺少其

结束锚标签

但它仍然不在你想要的最左边。您需要移动div的HTML顺序：

<div id="product_cell">    

  <div class="tag">
      <span class="price">$500.00</span><br />
      <span class="status sold">sold</span>
  </div>

  <img src="http://placekitten.com/100/100">
  <!-- ... -->

---

3。链接1、2、3、4

我不知道你想在这里做什么。尝试使用

z-index

---

从

div.product\u info

中的元素中移除浮动。让div本身浮动就足够了。在图像、信息div和标记div上使用float:right

链接2、3和4缺少关闭

，以及缺少关闭

无法在FF6中复制，可能已被以前的点或所需的更多信息修复

---

重新组织了一点布局和css：

对不起，我没有得到状态和价格应该在哪里？我的错。我的意思是1号和2号的对立面。所以它们应该向左浮动。但是非常感谢！你是如何解决第三个问题的？图像会正确弹出，但会被显示所有产品的“我的页面”的“主要内容”div剪切。从主块的样式中删除任何

溢出：auto

，并在末尾添加

，以向下拉伸块。

 #product_cell .tag { float: left; clear:right;  height:50px; }