标签: height

这是HTML:

<div id="outer">
    <div id="inner"></div>
    Test
</div>

这是CSS:

#inner {
  float: left;
  height: 100%;
}

在使用Chrome开发人员工具进行检查后,内部div的高度为0px.

如何强制它为父div的高度的100%？

如何在不设置特定高度(或最小高度)的情况下让div自动调整为我为其设置的背景大小？

为什么百分比值height不起作用,但百分比值width呢？

例如:

<div id="working"></div>
<div id="not-working"></div>

#working{
    width:80%;
    height:140px;
    background:orange;
}
#not-working{
    width:80%;
    height:30%;
    background:green;
}

最终的宽度为#working视口的80%,但最终的高度为#not-working0.

我有一个包装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>

我有2个画布,一个使用HTML属性width并height调整大小,另一个使用CSS:

<canvas id="compteur1" width="300" height="300" onmousedown="compteurClick(this.id);"></canvas>
<canvas id="compteur2" style="width: 300px; height: 300px;" onmousedown="compteurClick(this.id);"></canvas>

Compteur1显示它应该,但不是compteur2.内容使用300x300画布上的JavaScript绘制.

为什么会有显示差异？

我的页面左侧有一个导航栏,我希望它可以拉伸到页面高度的100%.不仅是视口的高度,还包括在滚动之前隐藏的区域.我不想用javascript来完成这个.

可以在HTML/CSS中完成吗？

目前,使用STYLE,我可以使用width: 100%和auto高度(反之亦然),但我仍然不能将图像限制在特定的位置,分别是太宽或太高.

有任何想法吗？

我试图<div>在CSS中设置一个特定的百分比高度,但它只是保持与其中的内容相同的大小.<!DOCTYTPE html>但是,当我删除HTML 5 时,它可以工作,根据<div>需要占用整个页面.我希望页面验证,所以我该怎么办？

我有这个CSS <div>,其ID为page:

#page {
    padding: 10px;
    background-color: white;
    height: 90% !important;
}

我的页面上有一个div元素,其高度设置为100%.身体的高度也设定为100%.内部div具有背景和所有这些并且与身体背景不同.这适用于使div高度为浏览器屏幕高度的100%,但问题是我在div内部的内容垂直延伸超出浏览器屏幕高度.当我向下滚动时,div在您必须开始滚动页面的位置结束,但内容溢出超出该范围.如何让div始终一直到底以适应内在的内容？

这是我的CSS的简化:

body {
    height:100%;
    background:red;
}

#some_div {
    height:100%;
    background:black;
}

滚动页面后,黑度结束,内容流向红色背景.在#some_div上我将位置设置为相对位置还是绝对位置似乎并不重要,问题是否发生.#some_div中的内容大多是绝对定位的,它是从数据库动态生成的,因此无法提前知道其高度.

编辑:以下是问题的屏幕截图:

我有一个关于如何获得div高度的问题.我知道.height()并且innerHeight(),但在这种情况下,他们都没有为我做这项工作.问题是,在这种情况下,我有一个溢出宽度溢出的div:scroll和div有一个固定的高度.

如果我使用.height()或者innerHeight(),它们都给了我可见区域的高度,但如果我想要考虑溢出,我该怎么办？