css - Woocommerce 结帐显示 1 列...似乎无法恢复默认 2？

Question

遇到最奇怪的困境。我已经对我的网站的其余部分进行了相当广泛的修改，并为我的主题使用了自定义 css 编码。我的网站的其余部分都很好，但是自从升级到最新版本的 wordpress 后，我的结帐页面上的东西就被抛弃了。

无论如何，您可以看到这里发生了什么：

https://sportsautotech.com/checkout/

如您所见，“帐单和运输”框字段和“您的订单”框字段在 1 列中彼此下方。

如附图所示，我希望它们并排放置。

我目前没有为此结帐页面插入自定义 CSS。我已经尝试通过谷歌搜索添加其他海报所建议的自定义 css 代码，但似乎没有一个工作，实际上让事情变得更糟。

如果我能解决这个问题，是否有人对如何解决其他两个较小的问题有任何建议，即状态字段缩进和电话号码字段下降一行？

非常感谢任何潜在的帮助！请参考下文。

图片：

目前

想要的

标签： csswordpresswoocommercemultiple-columnscheckout

Answer 1

在您的 style.css 或 WordPress 定制器中通过以下 css 实现您的目标结果：

.row-fluid .span6 {
width: 46.93617% !important;
}

#billing_postcode_field{
float: left;
width: 45%;
}

#billing_phone_field {
width: 50%;
float: right;
}

#billing_state_field, {
float: unset !important;
 }

 .payment_method_stripe{
margin-top: 3rem
}

输出：