Question

我正在使用bootstrap，我发现文本字段的高度太小。它不到10px。我想知道它是小还是我犯了一些错误。

我使用萤火虫检查文本区域。它说高度为18px，这对我来说似乎不可能......而我得到的就像我从这里得到的那样。Text area from bootstrap example。这让我很感兴趣困惑... 我得到的是

input, textarea, select, .uneditable-input {
  border: 1px solid #CCCCCC;
  border-radius: 3px 3px 3px 3px;
  color: #555555;
  display: inline-block;
  font-size: 13px;
  height: 18px;
  line-height: 18px;
  margin-bottom: 9px;
  padding: 4px;
}

高度表示它是18px，但它不是...... 有人可以帮忙吗？！

Answer 1

添加<!DOCTYPE HTML>应解决此问题。这里问了同样的问题：Text input rendering issue with Twitter Bootstrap

Answer 2

包括最高答案没有帮助

我已经<!DOCTYPE html>了，这对我来说不是问题。我不知道是什么问题，但是我用我的css修复了它：

input[type=text], input[type=password], input[type=email], input[type=tel] {
    height: 28px !important;
}

这是一种解决方法，我不确定它是否有一些副作用。

Answer 3

我不知道为什么如果我打开一个干净的新HTML5页面它可以工作，但在我添加一些代码后我不知道它为什么会发生。所以我只需打开bootstrap.min.css文件并搜索：type="text"并且有高度属性，我将其更改为min-height，因为它必须正常工作。

Answer 4

是的，总height为28px，因为填充＆amp;边框也会height添加input，如下所示：

height 18px + 
4px padding-top + 
4px padding-bottom + 
1px border-top + 
1px border-bottom = 
Total 28px height

Answer 5

请在此处查看我的解决方案in a similar thread。

基本上，文本文件编码造成了我的全部麻烦。它表现在浏览器之间的这种微小差异，我浪费了几个小时思考CSS的原因。

Twitter Bootstrap文本字段的高度太小了？

5 个答案: