为什么浏览器会替换通过css分配的宽度值？

Question

当我为所有选择分配基本样式时,例如.

width: 300px;
padding: 0;
margin: 0;
border-width: 1px;

在不同情况下通过javascript检索宽度时,我得到意想不到的结果.

• 当选择可见时,with为298px.
• 当select为display:none时,宽度也是298px(ff,jquery)
• 当select在div中时,display:none,宽度正确为 300px.

(结果也是相同的分配:box-sizing:border-box)

好吧,检索到的宽度有时会与使用的浏览器和javascript框架不同,但总而言之,我只是希望能够检索指定的宽度(300px).(我想它必须与这里所说的"正式怪异"有关:http://meyerweb.com/eric/thoughts/2007/05/15/formal-weirdness/,但是为什么浏览器不会使用用户分配的宽度??)

如何检索指定的宽度？有没有办法做到这一点？

例子:

http://jsfiddle.net/ETCcH/5/(用于使用jquery,或者使用mootools将4替换为4)

(查看并尝试使用不同的浏览器)

Answer 1

你永远不会得到写在 css 文件中的值。使用 JavaScript，您只能获取 Web 浏览器当前应用于该元素的 css 属性。

在这种情况下，如果宽度确实是固定的，您可以“强制”将 max-width 设置为 300px 或添加overflow: hidden- 如果这是一个选项。