fixed定位问题_qq_27449993的博客-程序员秘密_display: fixed

技术标签：前端

position：fixed定位是相对视口宽度，即使在里面嵌套一层div，其定位也是display：fixed，在对其的宽度定位为20%时，也是相对于整个视口,而不是相对于父级元素

待研究：怎样让dispaly:fixed的定位是相对于父级，而不是整个视口

.ScreeningConditions {

        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 3;
    }
    .ScreeningConditionsLeft {
        width: 20%;
        height: 100%;
        background-color: black;
        filter: alpha(opacity=50);
        -moz-opacity: 0.5;
        -khtml-opacity: 0.5;
        opacity: 0.5;
    }
    .ScreeningConditionsRight {
        width:80%;
        height:100%;
        background-color:white;
        position:relative;
    }


    .ScreeningConditionsFoot {
        width:100%;
        text-align:center;
        position:fixed;
        bottom:0;
        height:40px;
        line-height:40px;

    }
    .ScreeningConditionsFootReset {
        width:30%;
        background-color:#d4d4d4;
        float:left;
    }
    .ScreeningConditionsFootOK {
        width: 50%;
        float:left;
        background-color: red;
    }

当ScreeningConditionsFootOK中width为70%时：

本文链接：https://blog.csdn.net/qq_27449993/article/details/78092126

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

HDOJ 1094 A+B for Input-Output Practice (VI)（水题）_阿金在森林的博客-程序员秘密

A+B for Input-Output Practice (VI)Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submission(s): 53165 Accepted Submission(s): 35864Problem Descri

SpringBoot配置knife4j版的Swagger打开doc.html页面404_qunwuhui的博客-程序员秘密

报错如下：其中swagger相关配置都没有问题，但是就是不能显示。最后发现引入的公司其他自定义jar中包含WebMvcConfigurer 或者是实现类WebMvcConfigurerAdapter或者是其他实现WebMvcConfigurer 接口的。导致冲突。最后去除jar中的引用即可，可采用如下代码去除@ComponentScan(basePackages = {"com.glaway.*"}, excludeFilters = @ComponentScan.Filt.

IntelliJ IDEA设置code style并自动格式化代码_intelj代码编辑_zw975807058的博客-程序员秘密

1.打开idea File->setttings->Editor->Code Style 按照喜欢的方式设置代码格式并保存2.下载Save Actions插件3.插件下载成功，进行配置在当前setting配置界面，点击Other Settings 选中红框中的选项即可...

软件测试工程师面试题--测试概念篇_测试人员测试理念测验题_sunny3906的博客-程序员秘密

1、你的测试职业发展是什么？测试经验越多，测试能力越高。所以我的职业发展是需要时间积累的，一步步向着高级测试工程师奔去。而且我也有初步的职业规划，前3年积累测试经验，按如何做好测试工程师的要点去要求自己，不断更新自己改正自己，做好测试任务。2、你认为测试人员需要具备哪些素质做测试应该要有一定的协调能力，因为测试人员经常要与开发接触处理一些问题，如果处理不好的话会引起一些冲突，这样的话工作上...

70道经典Android面试题加答案--重要知识点几乎都涉及到了_dengshi9519的博客-程序员秘密

1. 下列哪些语句关于内存回收的说明是正确的? (b ) A、程序员必须创建一个线程来释放内存B、内存回收程序负责释放无用内存 C、内存回收程序允许程序员直接释放内存 D、内存回收程序可以在指定的时间释放内存对象 2. 下面异常是属于Runtime Exception 的是（abcd）(多选) A、ArithmeticExcept...

ehcache2拾遗之copyOnRead，copyOnWrite_weixin_34357962的博客-程序员秘密

问题描述缓存在提升应用性能，提高访问效率上都是至关重要的一步。ehcache也是广为使用的缓存之一。但是如果将一个可变的对象（如普通的POJO/List/Map等）存入缓存中，会导致怎样潜在的问题。下面来看一个例子 //首先创建一个简单的POJO public class Student { private String name; public ...