Javascript 半响应css布局（取决于其余的宽度和高度）

你好，我需要你的建议。我有三个div-一个绝对大小为X和Y，另外两个则取决于其余窗口的宽度和高度。 我也想实现粘贴元素（

边距

，或

填充

0？）

我现在使用jquery和setwidth、setheight来实现这一点，但这并没有带来好的效果

$("#console").height(window.innerHeight - gameCanvas.height - 19);
$("#menu").height(gameCanvas.height);
$("#menu").width(window.innerWidth - gameCanvas.width - 6);

对不起，我是CSS新手，无法为我的问题找到好答案

#菜单是右上元素

#控制台关闭了

#gameCanvas是左上角的元素

请帮助我，我怎样才能实现它？

---

我只能用css来实现它吗？

这很可能只用css就可以实现。看看这是否适合您：

#gameCanvas{
  width:1024px;
  height:512px;
  float:left;
}
#menu{
  height:512px;
}
#console{
  clear:both;
  height:calc(100vh - 512px);
}

---

我使用

calc

和

vh

设置

控制台的高度。这一部分可能必须使用javascript来完成，以确保出色的浏览器支持。上述代码在中。
是的，您只需使用CSS即可实现。一个很好的起点是，谢谢，我会读到这篇文章，但对于我的noob项目，更好的答案如下。我将使用网格，当我将有更多的元素和复杂性非常感谢你！这是一个更好的答案，因为它和我的项目一样简单：D再次感谢