那些遇到过的问题

相关疑难解决方法(0)

textarea下的额外空间与浏览器不同

在textarea标签下有一些额外的空间.在不同的浏览器中从1到4像素.标记非常简单:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
    <head>
        <style>
            body {
                margin: 0;
                padding: 0;
            }
            .main {
                background-color: red;
            }
            textarea {
                background-color: gray;
                resize: none;
                margin: 0;
                border: 0 none;
                padding: 10px;
                height: 50px;
                overflow: hidden;
            }
        </style>
    </head>
    <body>
        <div class="main">
            <textarea></textarea>
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

以下是它在浏览器中的呈现方式:

截图

为什么会这样？如何删除这个额外的空间？

html css whitespace cross-browser removing-whitespace

Rom*_*man
2017 09-08
65
推荐指数
2
解决办法
1万
查看次数

如何在Firefox和Chrome中修复不一致的Textarea底部边距？

我正试图消除FF和Chrome似乎给予Textareas的额外底部余量.令人惊讶的是IE似乎正确地做到了.我想避免使用条件包括但CSS3调整是可以的.

示例代码

.red-box {
    background-color: red;
    overflow: hidden;
}
textarea {
    border: solid 1px #ddd;
    margin: 0px; /* Has no effect */
}
Run Code Online (Sandbox Code Playgroud) 
<div class="red-box">
    <textarea>No Margin Please!</textarea>
</div>
Run Code Online (Sandbox Code Playgroud)

css html5 textarea cross-browser

Tim*_*ord
2016 03-13
44
推荐指数
3
解决办法
1万
查看次数

标签 统计

cross-browser ×2

css ×2

html ×1

html5 ×1

removing-whitespace ×1

textarea ×1

whitespace ×1