如何将 "Empty Cart" 按钮上的文本居中?

How to center text on "Empty Cart" button?

我有以下代码,用于将“清除购物车”按钮添加到我的 woocommerce 购物车页面。按钮上的文字不以移动设备为中心,但希望如此。该按钮也不是完全圆形的,看起来不对。请访问我的网站 https://www.livestainable.co.za add an item to the cart to replicate my issue. I have also added some screenshots of the issue. 如果有人能帮我解决这个问题,我将不胜感激。谢谢大家

这里是手机端问题的截图。

add_action('woocommerce_cart_coupon','custom_woocommerce_empty_cart_button'); 函数 custom_woocommerce_empty_cart_button() { 回声 '' 。 esc_html('Empty Cart','woocommerce')。 ''; }

add_action('wp_loaded','custom_woocommerce_empty_cart_action',20); 函数 custom_woocommerce_empty_cart_action() { 如果(isset($_GET['empty_cart'])&&'yes'===esc_html($_GET['empty_cart'])){ WC()->购物车->empty_cart();

    $referer  = wp_get_referer() ? esc_url( remove_query_arg( 'empty_cart' ) ) : wc_get_cart_url();
    wp_safe_redirect( $referer );
}

}

您只需在样式中添加几行代码

/* centering text on mobile */
@media (max-width:767px) {
    table.shop_table.cart .coupon .button {
        text-align: center;
    }
}

/* fixing border radius on dekstop */
@media (min-width:768px) {
    table.cart .coupon .button:not(:last-child) {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
}