Как сделать две кнопки встроенными, если каждая из них имеет разную форму?

Просто переместите кнопку delete в другой тег формы. Это должно работать.

<form action = "#">
     <div class = "form-group">
        <label for = "title">Title</label>
        <input type = "text" name = "title" class = "form-control" id = "title" placeholder = "Enter title">
    </div>

    <div class = "form-group">
        <label for = "body">Body</label>
        <textarea class = "form-control" name = "body" id = "body" rows = "10"></textarea>
    </div>

    <button type = "submit" class = "btn btn-primary">Update</button>

    <form action = "#">
    <button type = "submit" class = "btn btn-danger">DELETE</button>
    </form>

</form>

Поплавок - очень хороший выбор для использования... Но мы также можем использовать дисплей: встроенный; Свойство для элемента формы... Вот так..

Предложение : -

   form{
       display: inline;
     }

Это тоже лучший вариант... И display inline несет в себе разрыв между элементами... Так что удаляйте и обновляйте кнопки будут выглядеть хорошо.