用css设置kendoui样式文本框的宽度

Question

我知道您可以更改文本框的宽度

@Html.TextBoxFor(m => m.LoginId, new { @class = "k-textbox", style="width:400px" })

但我想要一个更整洁的方法.

我尝试将其添加到新的css文件中

.k-textbox .small {
    width: 50px !important;
}
.k-textbox .medium {
    width: 120px !important;
}
.k-textbox .large {
    width: 320px !important;
}

在我的cshtml文件中

@Html.TextBoxFor(m => m.LoginId, new { @class = "k-textbox medium" })

但这不起作用.文本框的大小仍然保持不变

我错过了什么？

Answer 1

你的CSS定义是错误的.

.k-textbox .medium意味着你有一个DOM元素,class="k-textbox"并且在这个DOM元素中有另一个元素,class="medium"而不是你的情况.只需摆脱CSS规则中的空格:

.k-textbox.small {
    width: 50px !important;
}
.k-textbox.medium {
    width: 120px !important;
}
.k-textbox.large {
    width: 320px !important;
}