如何获取这些单选按钮以内联显示？

Question

我已使用下面的代码向Woocommerce Checkout添加提示字段。该代码将单选按钮一个放置在另一个上方，并将标签放置在该单选按钮下方。如何使标签显示在单选按钮旁边以及单选按钮显示为嵌入式？

function bbloomer_checkout_radio_choice() {

   $chosen = WC()->session->get('radio_chosen');
   $chosen = empty( $chosen ) ? WC()->checkout->get_value('radio_choice') : $chosen;
   $chosen = empty( $chosen ) ? 'no_option' : $chosen;

   $args = array(
   'type' => 'radio',
   'class' => array( 'form-row-wide' ),
   'options' => array(
      'no_option' => 'None',
      'option_1' => '10%',
      'option_2' => '15%',
      'option_3' => '20%',
   ),
   'default' => $chosen
   );

   echo '<div id="checkout-radio">';
   echo '<h3>Add a TIP!</h3>';
   woocommerce_form_field( 'radio_choice', $args, $chosen );
   echo '</div>';

}

更新

这是php生成的HTML。我没有应用任何自定义CSS。

<div id="checkout-radio">
    <h3>Add a TIP!</h3>
    <p class="form-row form-row-wide" id="radio_choice_field" data-priority="">
      <span class="woocommerce-input-wrapper">
        <input type="radio" class="input-radio " value="no_option" name="radio_choice" id="radio_choice_no_option">
        <label for="radio_choice_no_option" class="radio ">None</label>
        <input type="radio" class="input-radio " value="option_1" name="radio_choice" id="radio_choice_option_1">
        <label for="radio_choice_option_1" class="radio ">10%</label>
        <input type="radio" class="input-radio " value="option_2" name="radio_choice" id="radio_choice_option_2" checked="checked">
        <label for="radio_choice_option_2" class="radio ">15%</label>
        <input type="radio" class="input-radio " value="option_3" name="radio_choice" id="radio_choice_option_3">
        <label for="radio_choice_option_3" class="radio ">20%</label>
      </span>
    </p>
</div>

更新＃2

以下是解决此问题的CSS：

#checkout-radio label.radio {
  display: inline!important;
  margin-left: 5px;
}

#checkout-radio input[type=radio] {
  margin-left: 15px;
}

Answer 1

以下是解决此问题的CSS：

#checkout-radio label.radio {
  display: inline!important;
  margin-left: 5px;
}

#checkout-radio input[type=radio] {
  margin-left: 15px;
}