【问题标题】：wagtail hallojs editor video embed with padding-bottomwagtail hallojs 编辑器视频嵌入了 padding-bottom
【发布时间】：2014-07-24 13:52:31
【问题描述】：

我在玩 wagtail 并在使用默认 wagtail 编辑器 (hallojs) 插入视频时遇到了一个奇怪的 padding-bottom 问题。结果视频被包裹在.responsive-object div 中，内联样式padding-bottom: 62.5%;。由于我的视频根本没有响应，我想我做的不对。

我在嵌入的视频下有一个巨大的填充。我找不到解释如何集成 wagtail 的编辑器生成的 html 的地方。有a page in the documentation关于视频嵌入，但没什么用。

【问题讨论】：

标签： css django responsive-design video-embedding wagtail

【解决方案1】：

解决方案

很简单，搜索.responsive-object 并找到embed.ly responsive tutorial。为了让一切再次看起来不错，我需要这个 css：

.responsive-object {
  position: relative;
  padding-bottom: 67.5%;
  height: 0;
  margin: 10px 0;
  overflow: hidden;
}
.responsive-object iframe,
  .responsive-object object,
  .responsive-object embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

结果

如果有人从 hallojs 编辑器中找到有关如何正确集成内容的信息，请发表评论或回答；）

【讨论】：

仅供参考，此课程包含在“构建您的网站（面向前端开发人员）”文档中：docs.wagtail.io/en/latest/building_your_site/…
谢谢，我刚刚意识到我在阅读文档中的Building your site 时跳过了Template tags & filters。
只是我的小更新，我一直在寻找最新 Wagtail 2.5.1 中的草稿解决方案，这些 css 类可以完美运行。我的 youtube 视频是响应式的，谢谢。