Question

我有一个textarea在firefox上与左边完美对齐，但在chrome上，添加了一点空间。我不知道为什么会这样，但我尝试了很多东西来摆脱这个空间但是不能。 enter image description here Chrome将textarea推向右侧2像素。有谁知道我做错了什么，或者有没有办法在Chrome上对齐它？

这是我的代码：

HTML：

<html>
<head>
<link rel="stylesheet" type="text/css" href="testdiv.css" />
</head>
<body>
<div class="outermostshell">    
    <div class="textareashell">
            <textarea name="status" rows="2" cols="30"></textarea>
    </div>
</div>
</body>
</html>

CSS：

.outermostshell
    {
        position:fixed;
        width:300px;
        height:600px;
        background-color:red;

    }

.textareashell
    {
        position:relative;
        top:10px;
        padding:0;
        border:0;
        left:0px;
                margin:0px;
    }

非常感谢任何帮助。

Answer 1

某些浏览器（包括Chrome）具有表单元素的默认边距。只需将边距设置为零：

.textareashell textarea { margin: 0; }

Answer 2

我更喜欢使用padding-left：2px;

如何在chrome中删除div内部textarea的额外空间？

2 个答案: