相关疑难解决方法(0)

我有一个包装div,它将两个div相邻.在这个容器上方,我有一个包含我标题的div.包装div必须是100%减去标题的高度.标题约为60像素.这是固定的.所以我的问题是:如何设置我的包装div的高度为100%减去60 px？

<div id="header"></div>
<div id="wrapper">
  <div id="left"></div>
  <div id="right"></div>
</div>

我注意到我使用CSS3 calc()功能作为单位width在最新版本的Chrome中无效.

在Chrome开发者工具中,规则通过它calc()有一个删除线,并在其左侧有一个黄色三角形中的感叹号.这表明财产或价值未被识别.

如何让它在现代浏览器中运行？因为它是一个值而不是一个属性,所以供应商前缀在哪里？

更新:

当我说它不起作用时,我的意思是Chrome Dev Tools说它没有认识到我对它的使用width: calc(100%-88px);.我怎么知道它没有认出来？由于chrome开发工具中样式规则旁边的删除线和黄色三角形图标.

有问题的网页如下所示:

// The Header //
/*            */
/*  CONTENT   */
/*            */
// The footer //

页眉和页脚都有固定的高度.让我们说例如两者的高度都是20px.我需要将内容的高度设置为100%减去40px(页眉+页脚高度).我知道我可以使用JavaScript轻松完成这项工作,但如果有可能的话,学习如何使用纯CSS来实现它会很酷.

我有这个 html：

  <div class="container h-screen w-screen">
    <div class="navBar h-7"></div>
    <div class="content-container"></div>
  </div>

我已将 .navBar 的高度设置为 h-7。现在我想将 .content-container 的高度设置为 100vh-(h-7)。

我如何使用 calc() 来设置它？