2

I removed the shipping address on WooCommerce checkout page, and would like the billing address fields to fill all the website space.

Like this:

enter image description here

How can I do something like this?

Thanks.

LoicTheAztec
  • 229,944
  • 23
  • 356
  • 399
Capslock10
  • 796
  • 2
  • 16
  • 37

1 Answers1

2

You could try to add this in the styles.css file of your active child theme or theme:

.woocommerce-page.woocommerce-checkout .col2-set .col-1 {
    float: none !important;
    width: 100% !important;
}

Or alternatively in the function.php file of your active child theme or theme:

function custom_checkout_css_styles() {
    ?>
        <style>.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {float: none !important;width: 100% !important;}</style>
    <?php
};
add_action( 'woocommerce_checkout_before_customer_details', 'custom_checkout_css_styles' );

This code goes in function.php file of your active child theme (or theme) or also in any plugin file.

This is tested and works.

LoicTheAztec
  • 229,944
  • 23
  • 356
  • 399
  • If I want to change the position of the field (make the country field below the last name), should I do in the `form-billiing.php`? Btw, the code is working, thank you. – Capslock10 Oct 04 '16 at 02:48
  • @Capslock10 This is another question, that have nothing to do with that related code. So the best thing is to make a new question asking how to reorder checkout fields, and I will answer it. You haven't tell me If my answer works for you? – LoicTheAztec Oct 04 '16 at 02:54
  • Thank you for your reply. I will found some solution first. Thank for your help:). – Capslock10 Oct 04 '16 at 02:58
  • @Capslock10 In this thread you have all you need for this:http://stackoverflow.com/questions/39129295/checkout-custom-dropdown-selector-conditional-value-show-hide-other-custom-fiel/39181355#39181355 – LoicTheAztec Oct 04 '16 at 03:05