关于在绝对定位的textarea上使用left/top/right/bottom

Question

我试着设置position:absolute,然后left,top,right并bottom以像素为固定值,但除非我还设置width和height我不能让它在Firefox 11正常工作.

在safari/chrome上渲染看起来没问题......但是这是一个Firefox bug还是其他不符合标准的东西？使用100%width并且height有时是解决方案,但不是在元素未完全覆盖父容器时.

见http://jsfiddle.net/EjS7v/6/

这是Chrome(和期望的结果)

Firefox(宽度/高度为100%)

Firefox(没有宽度/高度)

有没有其他方法可以使用Javascript在运行时计算宽度和高度？

请注意,在此示例中,我使用固定大小的div作为容器,但最有趣和最有用的情况是容器是弹性的.

Answer 1

实际上有一个简单的替代方案,使用表示标记来包含textarea然后只有100%宽度的高度为textarea本身.

实际上,CSS非常有限.

Answer 2

这是因为textarea与 a 不同div，它具有默认的宽度和高度：

如果元素有一个cols属性，并且使用解析非负整数的规则解析该属性的值不会产生错误，那么用户代理应该使用该属性作为元素宽度属性的表示提示，值为 textarea 有效宽度（定义如下）。否则，用户代理的行为就好像它有一个用户代理级别的样式表规则，将元素的宽度属性设置为 textarea 的有效宽度。

的文本区域有效宽度a的textarea元件是尺寸×平均+ SBW，其中大小是元素的字符宽度，平均是元件的主要字体的平均字符宽度，在CSS像素，SBW是一个滚动条的宽度，在 CSS 像素中。（元素的 letter-spacing 属性不会影响结果。）

如果元素有一个rows属性，并且使用解析非负整数的规则解析该属性的值不会产生错误，那么用户代理应该使用该属性作为元素上 height 属性的表示提示，值为 textarea 有效高度（定义如下）。否则，用户代理的行为就好像它有一个用户代理级别的样式表规则，将元素的 height 属性设置为 textarea 的有效高度。

的文本区域有效高度一个的textarea元素是在所指定的元素的字符高度的行数的CSS像素的高度，再加上在CSS像素的滚动条的高度。