Html 如何显示一个h1元素，它旁边有一个内联元素，下面有一个p元素？

我在前面询问了将编辑/删除链接与h1元素内联的最佳方法。我能够通过给出的答案实现这一点，但我现在有额外的要求，我需要在h1下方显示一段并编辑/删除链接

到目前为止，我的HTML如下所示：

<div class="product-header">
  <div class="title">
    <h1>Product 1</h1>
  </div>
  <div class="admin">
      (<a href="#">Edit</a> | <a href="#">Delete</a>)
  </div>
  <p class="description">Product 1 is a cool product</p>
</div>

产品1
( | )
产品1是一款很酷的产品

我希望它看起来如下所示：

产品1（编辑|删除）
产品1是一款很酷的产品

…页面内容的其余部分

但我不确定使用什么CSS来实现这一点！我所做的每件事似乎都将描述段落与标题放在同一行，如下所示：

产品1（编辑|删除）产品1是一款很酷的产品

…页面内容的其余部分

---

.

您只需将

清除：两者都添加到
。说明
：

您只需将
清除：两者都添加到
。说明
：

无需在产品标题中添加
clear:both
，但您确实需要在产品标题中添加
clear:both
。如下所示的说明类：

.product-header .description {
    clear:both;
}​


附加说明：

CSS属性指定一个元素是可以位于它前面的浮动元素旁边，还是必须向下移动（清除）在它们下面。
无需在产品标题类中添加
clear:both
，但您确实需要在产品标题中添加
clear:both
。说明如下所示：

.product-header .description {
    clear:both;
}​


附加说明：

CSS属性指定一个元素是可以位于它前面的浮动元素旁边，还是必须向下移动（清除）到它们下面。

您好，现在清除您的p标记类
清除左侧

像这样

.product-header .description {
 clear:left;   
}


您好，现在清除您的p标记类
清除左侧

像这样

.product-header .description {
 clear:left;   
}