我想当点击按钮时，重复字段会出现在页面的右半部分，紧挨着原始字段。
我创建了这个代码，但是当我点击按钮时，重复的字段出现在原始字段的下面，它应该与原始字段相同，只在页面的右半部分与原始字段对齐。

var counter = 1;

    function duplicate() {
      // Get the input fields container
      var inputContainer = document.getElementById("inputs");

      // Get the input fields to duplicate
      var input1 = document.getElementById("input1");
      var input2 = document.getElementById("input2");

      // Clone the input fields
      var clonedInput1 = input1.cloneNode(true);
      var clonedInput2 = input2.cloneNode(true);

      // Generate unique IDs for the cloned input fields
      clonedInput1.id = "input1-" + counter;
      clonedInput2.id = "input2-" + counter;
      counter++;

      // Append the cloned input fields to the duplicated inputs container
      var duplicatedInputsContainer = document.getElementById("duplicatedInputs");
      duplicatedInputsContainer.appendChild(clonedInput1);
      duplicatedInputsContainer.appendChild(clonedInput2);
    }

<div id="inputs" class="short">
    <input id="input1" class="input" placeholder=" Add label..." type="text">
    <hr class="hr1">
    <input id="input2" class="placeholder" placeholder=" Add placeholder..." type="text">
    <button class="btn btn-delete">
      <i class="fas fa-trash-alt"></i>
    </button>
    <button onclick="duplicate()" class="button1">
     <img src="https://img.icons8.com/android/24/null/plus.png"/>
    </button>
 </div>
<div id="duplicatedInputs"></div>