html - Rails iframe 标签未 100% 填充整个页面

Question

我正在将谷歌地图嵌入到我的网站中，并且我希望 map 全屏显示。我有以下 iframe 代码，但您可以在屏幕截图中看到它没有填满整个屏幕。我正在使用 Ruby on Rails，所以我打赌这是某种 Rails 默认 CSS 导致的？

<iframe
  height="100%"
  width="100%"
  frameborder="0" style="border:0"
  src="<%= full_loc %>" allowfullscreen>
</iframe>

整个 View 代码如下所示(此时还很原始，哈哈):

<% full_loc = "https://www.google.com/maps/embed/v1/place?key=AIzaSyAC6wrz55kNEjlpa3g4ssAw9T4NdSa2mbM
  &q=" + @homes.location %>


<iframe
  height="100%"
  width="100%"
  frameborder="0" style="border:0"
  src="<%= full_loc %>" allowfullscreen>
</iframe>

<%= form_tag(homes_path, :method => "get", id: "search-form") do %>
<%= text_field_tag :search, params[:search], placeholder: "Search Posts" %>
<%= submit_tag "Search" %>
<% end %>

Answer 1

问题很可能是 iframe 的父级没有设置高度。

请尝试为 iframe 的每个父级添加 height: 100%;。

html, body { 高度: 100%; }