如何在Woocommerce网站上解决此内联代码对齐问题？

Question

试图弄乱某些CSS，我需要一些指导。我在我们的商店页面上显示产品评论的数量，但是评论数量显示在星级下。我正在尝试让评论数显示在星级旁边。对齐方式很奇怪。

我尝试了以下代码段：

.woocommerce ul.products li.product .star-rating,
.woocommerce ul.products li.product .woocommerce-review-link {
  display:inline-block
  }

评论数量和星级不很理想。图片已附上。

Website

screenshot

Screenshot 2

Answer 1

如果您无法访问标记，最简单的方法是使用position: relative并调整其最高值：

.woocommerce ul.products li.product .star-rating {
    display:inline-block;
}
.woocommerce ul.products li.product .woocommerce-review-link {
    display:inline-block;
    position: relative;
    top: -8px;
}

Answer 2

已解决。我将H2宽度设置为100％，就解决了。感谢您的所有帮助！