Как сделать этот вывод параллельно между значением и кнопкой удаления ⇐ CSS

[Anonymous]

Когда я ввожу что-то и нажимаю «Добавить», результат отображения стиля настолько неверный, что значение и кнопка «Удалить» не находятся в одной строке, между ними возникает пробел, надеюсь, кто-нибудь сможет мне помочь
Я думаю, что изменение CSS — не лучшее решение, которое я пробовал

Код: Выделить всё

function appendInput() {
var input = document.getElementById("input").value.trim();
var div = document.getElementById("div");
if (input !== '') {
var p = document.createElement("div");
p.setAttribute("id", "Wadiw");
var deleteButton = document.createElement("button");

deleteButton.setAttribute("id", "bt");
p.textContent = input;
deleteButton.textContent = "Delete";
deleteButton.addEventListener("click", function() {
div.removeChild(p);
div.removeChild(deleteButton);
});
div.appendChild(p);
div.appendChild(deleteButton);
document.getElementById("input").value = "";
} else {
document.getElementById("input").value = "";
}
}

function Submit() {
var pi = "";
var children = document.getElementById("div").children;
for (var i = 0; i < children.length; i++) {
if (children[i].nodeType === Node.ELEMENT_NODE) {
if (children[i].tagName === "DIV") {
pi += children[i].textContent + "\n";
}
}
}
document.getElementById("dew").innerHTML = pi;
}

Код: Выделить всё

Add
Submit

Подробнее здесь: https://stackoverflow.com/questions/787 ... ete-button