Wordpress自定义主题中的Woocommerce中心评级元素

我已经使用css成功地将woocommerce产品集中在我的页面上 . 然而,星级评分div拒绝集中任何我做的事情 . 我可以改变它的颜色和背景,所以我知道我指的是正确的元素 . 任何帮助,将不胜感激 .

CSS:

#top_rated_wrapper ul.columns-4 li.product {
  display:block;
  width:100%;
}

#top_rated_wrapper ul.columns-4 li.product a {
  text-align:center;
}

#top_rated_wrapper ul.columns-4 a {
  text-align:center;
  width:100%;
}

#top_rated_wrapper ul.columns-4 li.product img {
  object-fit:contain;
  object-position:center;
  max-width:100%;
  height:300px;
}

.star-rating {
  float:none;
  display:block;
  margin-left:auto;
  margin-right:auto;
}

最后一个类引用(.star-rating)并没有't work to center the element. ' #top_rated_wrapper'只是我自己的woocommerce内容包装器 . 我也试过一个直截了当的 text-align:center .

回答(1)

3 years ago

据我了解:
1.检查 .start-rating class元素的可视范围,如果它覆盖了整个宽度,那么
2.检查 .start-rating class元素是否具有子元素,然后使它们成为 display:inline-block 属性 . 并在 .start-rating 类中添加 text-align:center .

希望它可以帮到你 .