html – 将CSS宽度分配给某个位置：固定元素

概述我想要一个固定元素的宽度来匹配紧挨着它的div的宽度.想象一下标题和主要内容div.当标题和内容div嵌套在外部div中时,会出现匹配其宽度的问题.在这种情况下,每个的％宽度不再与其父级宽度匹配(例如,< body>标记),固定元素的宽度基于令我困惑的东西. 为了更好地解释我的意思,对比这两个js小提琴： > http://jsfiddle.net/2dudX/4/ 与 > http://jsfi 我想要一个固定元素的宽度来匹配紧挨着它的div的宽度.想象一下标题和主要内容div.当标题和内容div嵌套在外部div中时,会出现匹配其宽度的问题.在这种情况下,每个的％宽度不再与其父级宽度匹配(例如,< body>标记),固定元素的宽度基于令我困惑的东西.

为了更好地解释我的意思,对比这两个Js小提琴：

> http://jsfiddle.net/2dudX/4/
与
> http://jsfiddle.net/2dudX/10/

这是每个代码：

<div ID="fixed"></div><div ID="content"></div>​#fixed{ position:fixed; z-index:2; wIDth:90%;        height:25px; background:yellow;}#content{ wIDth:90%; height:300px; background:red}

与

<div ID="main">   <div ID="fixed"></div>   <div ID="content"></div>    </div > #main{ wIDth:95%}#fixed{ position:fixed; z-index:2; wIDth:90%;        height:25px; background:yellow;}#content{ wIDth:90%; height:300px; background:red}

仅在Jsfiddle#1中注意,无论您如何调整浏览器大小,黄色和红色divs宽度都会匹配.不幸的是,Jsfiddle#2更像是一个现实世界的场景,我想知道如何纠正ID =“fixed”div,使其宽度也与ID =“content”div匹配.

思考？

解决方法 你可以这样做 FIDDLE(相对于#main设置％)
固定元素的维度始终相对于根元素计算,因此您需要相应地重置％-unit
在这种特殊情况下,您需要设置：

#fixed {    wIDth: 85.5%;}

情况#main是95％,你的静态元素相对于main是90％.所以你需要计算它朝向根元素的宽度(1 * .95 * .9 = .855)

总结

以上是内存溢出为你收集整理的html – 将CSS宽度分配给某个位置：固定元素全部内容，希望文章能够帮你解决html – 将CSS宽度分配给某个位置：固定元素所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。