编辑Woocommerce结帐模板

thanks to all in advance, I'm quite new to woo costume edits and was wondering how can I change the woo checkout fields to look like in the picture (included). I'v tried to look up at the form-billing.php & form-checkout.php, but didn't figure out where all the fields so I can manipulate the output and edit in css all the rest.

regarding the issues a few more question:

1.can this be done with action/filters or need to be hand coded?

2.can I append an #id via functions.php to certain parts of woo commerce

sure you guys could help, cheers to all

Image:

There are actions and filters you can use to do loads of stuff with woocommerce checkout: https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/

However a quick css fix for what you want is:

#billing_address_1_field {
    width: 48%;
    float: left;
    clear: none;
}
#billing_address_2_field {
    width: 48%;
    float: right;
    clear: none;
    padding-top: 36px;
}

That worked for me.

</div>