javascript - Chrome 应用程序在全屏中创建新窗口 - html 元素不是全高

标签 javascript html google-chrome-app

我遇到一个问题,我正在全屏模式下创建一个新窗口,但该窗口中的内容最终并未占据全屏。 html 元素的高度最终约为 83px。我希望它占据窗口的整个大小,因为我在其上设置了特定的背景颜色等。我在应用程序的其他地方以类似的方式创建窗口,它工作正常,但在这个特定的实例中却不行。我不确定我错过了什么。

这是用于创建窗口的代码:

chrome.app.window.create('connectionError.html', { id: 'connectionError', state: 'fullscreen'}, function() {
    chrome.app.window.get('connectionError').fullscreen();
});

这是生成的页面的 html:

<!DOCTYPE html>
<html>
  <head>
      <meta charset='utf-8'>
      <title>Connection Error</title>
      <link rel="stylesheet" type="text/css" href="css/application.css">
      <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
      <script src="js/jquery-2.1.0.min.js"></script>
      <script src="js/bootstrap.min.js" type="text/javascript"></script>
      <script src="js/connectionError.js"></script>
  </head>


  <body>
    <div id="connectionErrorContainer" class="container">
        <div id="connectionError" class="col-md-12">
          <div class="alert alert-danger" role="alert" style="display:table-cell; vertical-align:middle; float:none;">Unable to connect. Please check your internet connection.</div>
        </div>
        <button id="restart" class="btn btn-primary">Restart</button>
    </div>
  </body>
</html>

最佳答案

您没有发布 CSS,所以我不确定,但我敢打赌这就是您所缺少的: html,body,#your-element { height: 100%; }

或者,如果您仅针对 Chrome,则只需将 height: 100vh 添加到您的元素即可。

关于javascript - Chrome 应用程序在全屏中创建新窗口 - html 元素不是全高,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29335930/

相关文章:

JavaScript从 “ng-bind”获取span值

javascript - 在同一选项卡中打开下 zipper 接

javascript - 如何在Web Worker中访问Chrome API?

javascript - 退出时将 Chrome 打包应用程序数据保存到存储中

javascript - 如何实例化 JQuery 小部件 - 使用什么文本

javascript - 我如何能够比较 JS 中的未定义?

javascript - 如何使表格中的整个 <tr> 像 <a href =""> 一样可点击

html - 如何限制页脚的宽度

php - 如何使用 css 将 .png 显示为 <h2> 和 <image> 的框架

javascript - Chrome 应用程序 jquery AJAX 请求不发送自定义 header