Html 在Wordpress中使用视口高度（vh）显示div标记窗口的百分比高度

但当我粘贴相同的代码时：

    <!-- dummy div -->
    <div style="height:100px;">
    </div>

    <!-- outer div to contain inner div (that has a margin) -->
    <div style="height:80vh;">

   <!-- inner most div now has its boundary defined by the outer div, so adding a border wont extend its width beyond the width of the browser window -->
   <div style="height:80vh; padding: 20px;">

   <!-- iframe set to fill 100% of its containing div -->
   <iframe src="http://insitu-app.com/insitu-tgrg-simplified.html" style="top:0; left:0; height: 100%; width: 100%; margin-left: auto; margin-right: auto; border: none" frameborder="0" allowfullscreen></iframe>

  </div>

  </div>

进入wordpress代码编辑器并发布。我希望div标记及其内容占据视口垂直高度的80%。如果这种方法在wordpress上不可行，并且它们是一种替代方法，请告诉我？非常感谢

在内容编辑器的文本视图中检查代码。 Wordpress内容编辑器在粘贴内容时会生成一些标记。 使用文本视图粘贴相同内容，并确保没有其他文本。它会很好用的

---

在你目前的情况下，额外的。。正在生成标签。

添加80vh div并在另一个80vh div中填充不是一个好主意。将内部div的高度更改为100%，并添加框大小：边框框；或者删除父div的高度。感谢内部div现在是：如果不是okHi，请告诉我，抱歉，但是。我取下了。。标记，但仍然没有更改检查页面上的输出标记。它仍然在内容周围生成。

标记。围绕您粘贴的每个评论，以及围绕。。。限制其高度的标签。请删除高度：80vh；从外divAkash K.，在内div内，我替换了高度：80vh；身高：100%；但我离开了外层舱，高度：80vh；因为我需要它是屏幕高度的80%。这样可以吗，推荐？可以。很好。还有一件事，高度单位vh仍然不受所有浏览器的支持。如果你想让你的网站在所有浏览器上运行，你应该对此进行研究