Html 文本框在IE和Chrome上呈现方式不同

我的文本框在IE和Chrome上的渲染非常不同

即

铬

你可以看到IE中文本框的宽度很小

我的html定义为

 <input id="Name" data-bind ="value:Name" style="width: 210px"/>

我尝试下载normalize.css并将其包含在脚本顶部，但它在不同的浏览器上仍然呈现不正确

我相信会有更多的投入需要，所以一定要让我知道你们需要什么来解决我的问题

这些是我正在使用的脚本

<link href="css/normalize.css" rel="stylesheet" />
<script src="../Myfolder/External/jQuery/jquery-1.7.2.js"></script>
<link href="../Myfolder/External/jQuery UI/css/smoothness/jquery-ui-1.8.20.custom.css" rel="stylesheet" />


<script src="../Myfolder/External/jQuery UI/js/jquery-ui-1.8.20.custom.min.js"></script>

<link href="../Myfolder/Styling/common.css" rel="stylesheet" />

<script src="../Myfolder/External/Knockout/knockout-2.2.0.js"></script>

<script src="../Myfolder/External/JSON/json2.min.js"></script>

<script src="../Myfolder/External/Knockout/Plugins/koExternalTemplateEngine_all.min.js"></script>

<script src="../Myfolder/External/Knockout/Plugins/knockout.validation.js"></script>

<script src="../Myfolder/External/Knockout/Plugins/knockout.mapping-latest.js"></script>
<link href="../Myfolder/External/Kendo/styles/kendo.common.min.css" rel="stylesheet" />
<link href="../Myfolder/External/Kendo/styles/kendo.default.min.css" rel="stylesheet" />
<link href="../Myfolder/External/Bootstrap/css/bootstrap.css" rel="stylesheet" />
<link href="../Myfolder/External/Bootstrap/css/responsive.css" rel="stylesheet" />

<script src="../Myfolder/External/Bootstrap/js/bootstrap.js"></script>

<script src="../Myfolder/External/Kendo/kendo.web.min.js"></script>
<script src="../NewUI2013/AgrOD/external/amplify/amplify.min.js"></script>
<script src="../Myfolder/External/Knockout/Plugins/knockout-kendo.min.js"></script>
<script src="../Myfolder/External/Knockout/knockout.dirtyFlag.js"></script>
<script src="../Myfolder/Custom/customKO.js"></script>
<script src="../Myfolder/Custom/custom.js"></script>

设置

高度：25px

或任何其他值应能解决此问题。最可能的问题是，由于您使用了太多外部源的css文件，浏览器可能会误解其中的一些文件。

尝试将文本框的高度设置为25px。您有许多css导入，这些导入都将按照导入顺序优先于其他导入。html中的

style

元素将优先于外部样式表。这将是一个CSS问题，因此您需要解释为什么要使用所有这些不同的CSS文件。如果输入的HTML来自实际代码，则缺少type属性

type=“text”

。通常情况下，现代css框架会以这种类型的输入为目标

input[type=text]{/**css…**/}

@Mike我使用了type=text，但没有helped@cms_mgr您会说“html中的样式元素将优先于外部样式表。”但只有当

元素位于

下方时才是这样。通常情况下，优先级是从上到下的：无论是

还是

，后面出现的样式表都会覆盖前面的样式表。我认为浏览器不会“曲解”样式表，用户/开发人员可能会将它们放在错误的位置或错误的顺序，尽管如此，也许我并没有误解，但有时候确实会。IE过去的百分比舍入方式与webkit浏览器不同。IE曾经有一个问题，当其他浏览器支持时，元素的最小高度不能小于字体高度。我只是猜测这可能是问题所在，因为不可能浏览他包含的每个css文件。@Aneesh我接受了你的答案，但我认为样式表没有任何问题。