position:fixed和width:继承父百分比 [英] position:fixed and width:inherit with percentage parent

查看:2099
本文介绍了position:fixed和width:继承父百分比的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图给一个百分比父代的元素a width (这里 #container )。当我使用像素,而不是百分比,那么它的工作原理。我该怎么做? CSS 可能吗?

I'm trying to give a fixed element a width of a percentage parent (here #container). When I use pixel instead of the percentage then it works. How can I do it? Is this possible with CSS?

HTML

<div id="outer">
  <div id="container">
    <div id="fixed">
        Sitename
    </div>               
  </div>
</div>

CSS

#outer{
  width:300px;
  border: 1px solid yellow;   
}

#container {
  width: 90%; /*When I use e.g 250 px it works. But I need it in percentage*/
  border: 1px solid red;
  height: 300px;
}

#fixed {
  position: fixed;
  width: inherit;
  border: 1px solid green;
}

JSFiddle

添加

code> position:fixed 。因为我想将它放在页面底部,如下所示:

I need position:fixed. Because I want to place it at the bottom of the page like this:

JSFiddle

位置:relativ 的解决方案不适用于我。

Solution with position:relativ doesn't work for me.

推荐答案

看起来好像静态值(250px)可以通过正常继承传播。而当使用相对值(90%)时,固定的div已经被取出流,现在继承,它的父是视口。在我看来,你将不得不使用良好的旧js。

It seems as though the static value (250px) can be propagated through normal inheritance. Whereas when the relative value (90%) is being used, the fixed div has already been taken out-of-flow, and now inheritance-wise, it's parent is the viewport. It seems to me that you're going to have to use good old js.

但是,这个问题是几个月前,所以它可能没有关系。

But, this question is months old now, so it probably doesn't matter either way.

这篇关于position:fixed和width:继承父百分比的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆