使用jquery调整元素大小会打破100％的高度

Question

我有一个有这个css的侧边栏：

  background:#164272;
  position:absolute;
  left:0px;
  top:70px;
  width:250px;
  height:100%;

使用jquery im显示默认情况下隐藏的表，仅在单击元素时显示。 但是当我在较小尺寸的屏幕上显示元素时，它几乎打破了100％的高度。这是一张图片

如何防止它突破100％？ 谢谢

Answer 1

尝试身高100％html和身体。 ％高度相对值。所以它必须需要标准高度值。在这个时候html，身体是标准。

不要忘记DOCTYPE声明。

    html, body 
 {height: 100%;
  overflow:hidden;}

  #yourDiv{
  background:#164272;
  position:absolute;
  left:0px;
  top:70px;
  width:250px;
  height:100%;
  }

http://jsfiddle.net/under_09/4bs4r0y5/

Answer 2

如果侧边条的100％高度是您想要的所有屏幕分辨率，那么为什么不

.sidebar {
   top : 0;
   bottom:0;
   left :0;
}

完全成熟的demo here

请注意，由于您的宽度是在PX中定义的，因此在结帐min-width和max-width上不能完全转让。