如何让css能够自适应当前页面？

如何让css能够自适应当前页面

这是一个css文件：

.shadow_css {   /*出现悬浮窗口后,背景变暗*/
  display: none;
  position: absolute;
  top: 0%;
  left: 0%;
  min-width: 100%;
  min-height: 100%;
  background-color: black;
  z-index: 10;
  /* 为mozilla firefox 设置透明度  */
  -moz-opacity: 0.6;
  /* 设置透明度 */
  opacity: 0.6;
  /* 为IE 设置透明度  */
  filter: alpha(opacity=66);
}

页面缩小以后效果如下：

页面放大以后的bug：

会有一部分还能操作，没有完全隐藏起来，请问这个问题该如何解决？

.shadow_css加个bottom:0

推荐 flex布局，以及父容器的VW,VH布局

这不是基本操作嘛

可以试试less语法，使用多种分辨率来做适应。@media这种语法，支持属性和条件设置。