So I have an extremely strange thing happening. I am trying to properly layout my checkout page using Bootstrap’s Grid framework. All seems good, except for in the payment method section. When trying to wrap the payment.php page in a COL-LG-6 column, the DIV duplicates with no explanation, wrapping the div twice.

Now, if I delete the <div class="col-lg-6"> tag, there is NO div of its sort whatsoever. I hope that makes sense, but for example, the code excerpt:

defined( 'ABSPATH' ) || exit;

?>
<div class="col-lg-6">
<?php

    if ( ! is_ajax() ) {
        do_action( 'woocommerce_review_order_before_payment' );
    }
    ?>
    <div id="payment" class="woocommerce-checkout-payment">
        <?php if ( WC()->cart->needs_payment() ) : ?>
            <ul class="wc_payment_methods payment_methods methods">
                <?php
                if ( ! empty( $available_gateways ) ) {
                    foreach ( $available_gateways as $gateway ) {
                        wc_get_template( 'checkout/payment-method.php', array( 'gateway' => $gateway ) );
                    }
                } else {
                    echo '<li class="woocommerce-notice woocommerce-notice--info woocommerce-info">' . apply_filters( 'woocommerce_no_available_payment_methods_message', WC()->customer->get_billing_country() ? esc_html__( 'Sorry, it seems that there are no available payment methods for your state. Please contact us if you require assistance or wish to make alternate arrangements.', 'woocommerce' ) : esc_html__( 'Please fill in your details above to see available payment methods.', 'woocommerce' ) ) . '</li>'; // @codingStandardsIgnoreLine
                }
                ?>
            </ul>
        <?php endif; ?>
        <div class="form-row place-order">
            <noscript>
                <?php
                /* translators: $1 and $2 opening and closing emphasis tags respectively */
                printf( esc_html__( 'Since your browser does not support JavaScript, or it is disabled, please ensure you click the %1$sUpdate Totals%2$s button before placing your order. You may be charged more than the amount stated above if you fail to do so.', 'woocommerce' ), '<em>', '</em>' );
                ?>
                <br/><button type="submit" class="button alt" name="woocommerce_checkout_update_totals" value="<?php esc_attr_e( 'Update totals', 'woocommerce' ); ?>"><?php esc_html_e( 'Update totals', 'woocommerce' ); ?></button>
            </noscript>

            <?php wc_get_template( 'checkout/terms.php' ); ?>

            <?php do_action( 'woocommerce_review_order_before_submit' ); ?>

            <?php echo apply_filters( 'woocommerce_order_button_html', '<button type="submit" class="button alt" name="woocommerce_checkout_place_order" id="place_order" value="' . esc_attr( $order_button_text ) . '" data-value="' . esc_attr( $order_button_text ) . '">' . esc_html( $order_button_text ) . '</button>' ); // @codingStandardsIgnoreLine ?>

            <?php do_action( 'woocommerce_review_order_after_submit' ); ?>

            <?php wp_nonce_field( 'woocommerce-process_checkout', 'woocommerce-process-checkout-nonce' ); ?>
        </div>
    </div>
    <?php
    if ( ! is_ajax() ) {
        do_action( 'woocommerce_review_order_after_payment' );
    } ?>
</div>

Seems normal, correct? But if that col-lg-6 DIV exists, the output will be:

<div class="col-lg-6">
    <div class="col-lg-6">

Despite having only used the DIV once. If I delete that, there are 0 <div class=col-lg-6"> tags. So where the heck is the duplicate wrap coming from??? I can’t figure this out!