28

我正在尝试使用 Twitter 的引导程序快速浏览几页。我在让文本字段像在http://twitter.github.com/bootstrap/上那样呈现时遇到问题

我的 HTML 看起来像 

<div class="clearfix">
    <label for="unit">unit</label>
    <div class="input">
       <input class="xlarge" id="unit" name="unit" type="text" value="" />
    </div>
</div>

这似乎是我在演示页面上看到的所有相关 CSS 类。但是，我的文本输入字段在垂直方向上呈现的输入区域太小，因此光标和文本与输入区域的底部边框重叠。这是win7上最新的chrome。

在此处输入图像描述

4

8 回答 8

58

当 doctype 输入错误时也会触发此行为。就我而言，<!DOCTYPE>（错误）已修复，<!DOCTYPE HTML>问题就消失了。

于 2011-09-08T11:21:37.887 回答
9

http://twitter.github.com/bootstrap/scaffolding.html

需要 HTML5 文档类型 Bootstrap 使用需要使用 HTML5 文档类型的 HTML 元素和 CSS 属性。确保将它包含在项目中每个 Bootstrapped 页面的开头。

<!DOCTYPE html>
<html lang="en">
  ...
</html>
于 2012-03-21T20:16:29.470 回答
5

<html>当文档在最外层缺少标签时，就会出现这种行为。在整理我的模板后，它看起来应该。感谢记事本++。

于 2011-08-25T20:27:06.110 回答
2

我遇到了同样的问题，但在我的情况下，这是由于文件之间的文本编码不一致引起的。一些文件用 UTF-8 编码，没有 BOM（字节顺序标记），而其他文件用 UTF-8 编码，包括 BOM。我将所有文件都切换到没有 BOM 的 UTF-8 并且它工作正常。

于 2012-05-20T18:57:03.420 回答
0

谢谢大家，这对我有帮助。
我也面临这个问题，以帮助我分享我的旅程的其他用户如何解决它。问题如下所示： 在此处输入图像描述

这个问题出现在 Firefox 中，它在 chrome 中看起来很合适。

我如何找到解决方案：

  • 我知道您认为这是 css 优化的问题。或者它背后没有适当的CSS。
  • 我正在使用引导程序，然后想到的第二个想法是输入框没有合适的班级位置。
  • 当我遇到这个问题并开始阅读答案时，他们建议<!DOCTYPE html>我不相信这个问题，但我开始看那个页面。
  • 我还检查了 Firefox 中的查看源代码，但存在<!DOCTYPE html>
  • 突然，我查看了 firebug html，这里确实没有 DOCTYPE，而在所有其他页面中它都来了。

现在我想为什么会发生这种情况，背后的原因。
然后我看一下jsp页面。这是我的问题，有人在正文之前包含另一个jsp页面。

希望这个亮点有所帮助。

于 2014-07-23T06:24:21.887 回答
0

替换class="x-large"为：class="input-block-level"

于 2013-09-09T14:43:00.740 回答
0

就我而言：
- 我在表单中输入了文本
- 它在 Firefox 中有效，但在 Chrome 中无效

我通过覆盖引导 css 中的行高来解决这个问题。首先是这样的：

line-height: inherit;

当我在我的 css 中更改它时（所以它会覆盖引导 css）：

line-height: normal;

有效！

对于看到此内容但不知道我在说什么的人，请按 f12 并转到您的文本框。
现在在样式选项卡中，您将看到：

input, button, select, textarea {
   font-family: inherit;
   font-size: inherit;
   font-height: inherit;
}

那是您要覆盖的那个。

于 2014-04-03T12:56:28.707 回答
-1

我的文件是在 Windows 中创建的，我也遇到了类似的问题，即高度太小，所以下降的部分被截断了。我的文件有一些 PHP 作为第一行，然后是所需的 html。阅读所有评论后，我将我的（2 行）移到 PHP 之前的顶部，高度增加了......所以问题解决了。似乎 DOCTYPE 必须在任何 PHP 之前开始。

于 2013-05-19T07:06:00.847 回答