为什么百分比高度在我的div上不起作用
我有两个div，高度为90％，但显示方式有所不同。
我试图在它们周围放一个外部div，但这没有帮助。此外，在Firefox，Chrome，Opera和Safari上也是如此。
有人可以解释为什么我遇到这个问题吗？
下面是我的代码：
<div style="height: 90%">
<div ng-controller="TabsDataCtrl" style="width: 20%; float: left;">
<tabset>
<tab id="tab1" heading="{{tabs[0].title}}" ng-click="getContent(0)" active="tabs[0].active"
disabled="tabs[0].disabled">
</tab>
<tab id="tab2" heading="{{tabs[2].title}}" ng-click="getContent(2)" active="tabs[2].active"
disabled="tabs[2].disabled">
</tab>
</tabset>
</div>
<div id="leaflet_map" ng-controller="iPortMapJobController">
<leaflet center="center" markers="markers" layers="layers" width="78%"></leaflet>
</div>
</div>
问题答案：
使用vh（视口高度）代替百分比。它将获取浏览器的高度并相应地调整其大小，例如
height:90vh;
试试这个代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div id ="wrapper">
<div id="tabs" ng-controller="TabsDataCtrl">
<tabset>
<tab id="tab1" heading="{{tabs[0].title}}" ng-click="getContent(0)" active="tabs[0].active"
disabled="tabs[0].disabled">
</tab>
<tab id="tab2" heading="{{tabs[2].title}}" ng-click="getContent(2)" active="tabs[2].active"
disabled="tabs[2].disabled">
</tab>
</tabset>
</div>
<div id="leaflet_map" ng-controller="iPortMapJobController">
<leaflet center="center" markers="markers" layers="layers"></leaflet>
</div>
</div>
</body>
</html>
与CSS
<style>
#wrapper{height:60vh;}
#tabs {width:20% float:left; height:60vh; overflow-y:scroll; overflow-x:hidden;}
#leaflet-map{width:78%; height:60vh; overflow-y:scroll; overflow-x:hidden;}
</style>
-
问题内容： 我有两个div，高度为90％，但显示方式有所不同。 我试图在它们周围放一个外部div，但这没有帮助。另外，在Firefox，Chrome，Opera和Safari上也是如此。 有人可以解释为什么我遇到这个问题吗？ 下面是我的代码： 问题答案： 使用（视口高度）代替百分比。它将获取浏览器的高度并相应地调整其大小，例如 试试这个代码 与CSS
-
问题内容： 为什么百分比值不起作用，但是百分比值却起作用呢？ 端部的宽度为视口的80％，但端部的高度为0。 问题答案： 块元素的高度默认为块内容的高度。因此，给定这样的东西： 将生长到足以容纳段落的高度，并且将生长到足以容纳段落的高度。 当您将高度或宽度指定为百分比时，这是相对于元素父级的百分比。对于宽度，除非另有说明，否则所有块元素的宽度一直与其父元素一样，一直到；因此，块元素的宽度与它的内容无
-
问题内容： 我正在尝试使用带有百分比的height属性，但是它不起作用。我想使用百分比，因此在任何分辨率下看起来都不错。 我该如何运作？ 问题答案： 当您使用宽度或高度时，您应该问的第一个问题是什么？因此，您还需要对父元素应用高度，因此，假设您的父元素位于body标签内，则需要在CSS中使用此元素 所以，现在你的元素是的 注意：另外，当您处理定位的元素时，您可能会遇到一种情况，即您的高度不会超过当
-
问题内容： 我正在尝试将一个或元素垂直居中放置在另一个元素中。但是当我放进去时，什么也没发生。我尝试更改两个元素的属性，但似乎没有任何效果。 这是我当前在网页中执行的操作： 问题答案： 锁定了 160天。目前，此答案的内容已解决存在争议。它当前不接受新的交互。 这似乎是最好的方法-自我的原始文章以来已经过去了一段时间，现在应该这样做：
-
问题内容： 我使用占用所有可用空间的第三方组件，即width=100%和height=100%。我没有控制权。 我正在尝试使其适合以下布局，但是它height=100%不起作用（我希望第三方组件占据所有绿色空间）。 为什么？您将如何解决？ 问题答案： 通常，对于使用percent on height来获取其父代的高度的元素，父代需要的高度不是auto或定位为绝对高度，否则height将计算为aut
-
问题内容： 这是完整的代码： 什么也没出现。但是，如果我删除第一行（），则所有页面均按预期绿色。 我有两个问题： 如何在不删除标签的情况下填写页面？ 为什么要删除使其起作用？ 问题答案： CSS 属性，百分比值和DOCTYPE 问题的 第一部分 询问如何对您的身高施加100％的高度，其他人多次回答。本质上，在根元素上声明高度： 问题的 第二部分 受到的关注要少得多。我会尽力回答。 为什么去除mak