相关疑难解决方法(0)

如何强制Firefox渲染textarea填充与div中相同?

我试图在IE8,Firefox和Safari中的textarea内部以像素为单位提供一致的宽度,以便文本内容尽可能地以可预测和一致的方式包装行.

Firefox正在做一些有点奇怪的事情:它在textarea的内容空间与其他两个浏览器之间有一个额外的填充像素,与一个类似装备的div块相比.

将此类应用于textarea和div时,差异是可见的,div中的文本触及红色背景的左外边缘,但textarea中的文本尽管填充为零,仍具有1 px填充式偏移:

.testbox{
    padding:0;
    margin:0;
    border:0;
    background: red;
    width: 40px;
    height: 40px;
    font-size: 12px;
    line-height: 16px;
}
Run Code Online (Sandbox Code Playgroud)

填充的其他值最终显示一个额外的偏移像素与div.

关于是否有办法欺骗Firefox渲染textarea就好像它是一个div,或者为textarea调整这个不填充但看起来像填充属性的任何想法?

css firefox textarea padding

5
推荐指数
1
解决办法
4520
查看次数

在div中以与textarea中相同的方式包装文本

我在实时编辑HTML textarea时创建了一个建议面板.为了获得{x,y}坐标,我使用了一个隐藏在textarea后面的div.我得到了carret的位置,然后将carret之前的文本和span标签复制到隐藏的div.然后我得到跨度坐标并将其提供给建议面板.

唯一的问题是,当我向textarea添加一个没有空格的长行时,该行在div面板中被剪切时被包裹(因此在我添加回车之前,建议面板不再适合放置).

有没有办法在这两个地方(textarea和div面板)以相同的方式拟合文本?

(我正在使用jQuery)

html javascript jquery textarea

3
推荐指数
1
解决办法
2727
查看次数

标签 统计

textarea ×2

css ×1

firefox ×1

html ×1

javascript ×1

jquery ×1

padding ×1