Как добавить кнопку справа на панели bootstrap - PullRequest
0 голосов
/ 09 мая 2020

Я пытаюсь добавить кнопку удаления справа от панели bootstrap. Что бы я ни делал, это не соответствует заголовку панели. Помогите, пожалуйста.

panel with button

<div class="panel-heading">
     Update Article
     <form class="delete_form pull-right" id="delete_form" method="post" action="" enctype="multipart/form-data">
        <input type="submit" name="submit" class="btn btn-danger" value="Delete" onclick="return confirm(\'Are you sure you want to delete this item?\');" />
    </form>
</div>

Редактировать 1: Добавлен остальной код панели.

    <div class="panel-body">
        <form class="article_form" id="article_form" enctype="multipart/form-data">
            <div class="row">
                <div class="col-sm-6 form-group">
                    <label for="title" requiredField>Title*</label>
                    <input type="text" class="form-control" id="title" value="$title" name="title" maxlength="100" required>
                </div>
                <div class="col-sm-6 form-group">
                    <label for="pdf_link">PDF Link*</label>
                    <input type="text" class="form-control" id="pdf_link" value="$pdfurl" name="pdf_link" maxlength="100" required>
                </div>
            </div>
            <div class="row">
                <div class="word_file col-sm-6 form-group">
                    <label>Upload Microsoft Word file of the article.</label>
                    <input class="form-control" accept=".doc, .docx" type="file" id="word_file" name="word_file">
                </div>
                <div class="word_unavailable col-sm-6 form-group">
                    <label for="ur_name">Check if Microsoft Word file is unavailable.</label>
                    <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="chk_word" name="chk_word">
                        <label class="form-check-label" for="wordfiles">MS Word file is unavilable</label>
                    </div>
                </div>
            </div>
            <input type="submit" name="submit" class="btn btn-primary" value="Update" />
        </form>
        </div>
    </div>

Я не использую любой пользовательский css.

Изменить 2: Необходимые результаты

results should like this

1 Ответ

1 голос
/ 09 мая 2020
<body>
<div class="panel panel-default">
    <div class="panel-heading container-fluid">Update Article
        <form class="pull-right" id="delete_form" method="post" action="" enctype="multipart/form-data">
            <input type="submit" name="submit" class="btn btn-danger" value="Delete" onclick="return confirm(\'Are you sure you want to delete this item?\');" />
        </form>
    </div>
    <div class="panel-body">Any content</div>
</div>
</body>
...