Fatal编程技术网
  • css/
  • Css 如何修复Firefox和Chrome中不一致的Textarea底部边距？

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

css html

Css 如何修复Firefox和Chrome中不一致的Textarea底部边距？,css,html,cross-browser,textarea,Css,Html,Cross Browser,Textarea,我正试图消除FF和Chrome给文本区域的额外底部边距。令人惊讶的是，IE似乎做得对。我想避免使用条件包含，但CSS3调整是可以的 示例代码 。红色框{ 背景色：红色； 溢出：隐藏； } 文本区{ 边框：实心1px#ddd； 保证金：0px；/*无效*/ } 请不要留边际！ 默认情况下，我相信Chrome和Firefox都会将这些元素设置为display:inline block。在您的样式中设置display:block，您应该已经全部设置好了。为您的文本区域设置display:block

我正试图消除FF和Chrome给文本区域的额外底部边距。令人惊讶的是，IE似乎做得对。我想避免使用条件包含，但CSS3调整是可以的

示例代码

。红色框{
背景色：红色；
溢出：隐藏；
}
文本区{
边框：实心1px#ddd；
保证金：0px；/*无效*/
}

请不要留边际！
默认情况下，我相信Chrome和Firefox都会将这些元素设置为
display:inline block。在您的样式中设置
display:block
，您应该已经全部设置好了。
为您的文本区域设置
display:block
。
只需禁用如下调整大小即可


textarea{resize:none；}
如果您想让它保持内联，只需尝试


vertical-align: top



对不起，那没用。但我也认为这是一件晦涩难懂的事情。这对我来说很有效，我在其他任何地方都找不到它。谢谢我从来不知道这件事！很好，如果你不想把它变成块：）FWIW，我不能再在Firefox45上重现这个问题了。但它仍然出现在铬48上。太好了。但是，您还必须使用
显式设置
边距
！重要信息
。因为当textarea使用
display:block
时，Chrome似乎将textarea的边距保持在其容器的“固定”位置。。。（您可以看看解决该问题的方法。）