Summernote 模态没有填充

Question

我正在为我的 Laravel 应用程序使用一个名为 Ticketit 的程序包。

这利用 Summernote 进行文本编辑，但是当我想添加 links、图片等时，为此打开的模态 window 在输入周围没有填充。

我对 CSS 不太满意，我不确定为什么会这样，也不知道我能做些什么来解决这个问题。

您可以通过 Ticketit 演示站点查看我所面临的示例； http://ticketit.kordy.info/tickets/create。您可以使用 admin@example.com 和 demo 登录，它将带您进入工单创建页面。单击添加 link 后，您将看到以下内容：

模态主体代码如下所示：

<div class="modal-body">
    <div class="form-group note-group-select-from-files">
        <label>Select from files</label>
        <input class="note-image-input form-control" type="file" name="files" accept="image/*" multiple="multiple">
    </div>
    <div class="form-group" style="overflow:auto;">
        <label>Image URL</label>
        <input class="note-image-url form-control col-md-12" type="text">
    </div>
</div>

我如何在表单标签和输入周围提供一些填充，以便它们不接触模态框的两侧 window？

请注意，Summernote 输入的 CSS 当前是通过 CDN 提供的，因此我无法直接为此编辑源代码 - 我希望可以更改 Summernote 的设置。

否则我可以在单独的样式表中添加一些自定义 CSS。

Answer 1

您需要更改 .modal-body 上的填充：

.modal-body {
  padding: 30px;
}

应用该规则会给你：

Summernote 模态没有填充

Summernote modal has no padding

html

css

twitter-bootstrap

summernote