更改 Woocommerce 帐单地址字段中的字段宽度

Question

我有一个使用子主题的 WordPress 站点，我在其中安装了 WooCommerce，但是帐单/运输 forms 看起来很奇怪，未对齐，并且大多数字段都很小。 国家/地区字段（例如）如下所示：

我试图通过在函数中使用 function 来更改字段 class 以使其更大，但它似乎不起作用。 这是我使用的：

function em_align_address_checkout_fields( $fields ) {
   $fields['billing_country']['class'][] = 'form-row-wide';

   return $fields;
}
add_filter( 'woocommerce_billing_fields', 'em_align_address_checkout_fields' );

有没有办法改变字段的宽度？ 如果您知道如何解决整体风格，我将不胜感激，与其他文章相比，我不认为这是它应该看起来的样子，而且我不是 Woocommerce 或 Wordpress 方面的专家。

谢谢您的帮助！

Answer 1

您可以为子主题 css 中的这些字段编写自定义 css。

    .woocommerce-billing-fields__field-wrapper label{ width 50%;float:left;}/* Use this only if necessary.It may affect overall checkout fields layout */
    #billing_country_field label{ width:50%;}
    #billing_country_field select{ width:50%;}

或者您可以使用官方扩展来覆盖结帐布局。

https://docs.woocommerce.com/document/checkout-field-editor/