调整剑道多选的高度

问题描述

我正在尝试调整 Kendo Multi-Select 的认高度(和线高)以适应屏幕上其他控件的大小。我“开始”尝试使用与 Kendo DropDownList 相同的 CSS……但这似乎失败了。

CSS:

.k-multiselect { display: inline-block; width: 400px;}
.k-multiselect-wrap .k-input { line-height: 20px; }
.k-multiselect-wrap .k-select { line-height: 1.7em; min-height: 1em; }

代码

@(Html.Kendo().MultiSelect()
      .Name("msPurpose")
      .AutoClose(false)
      .TagMode(TagMode.Single)
      .DataTextField("PurposeCategory")
      .DataValueField("Id")
      .BindTo(Model.Purposes)
      .Value(Model.Purposes)
      .ItemTemplate("<input type='checkBox' name='chkPurpose' value='#:data.Id#' checked /> #:data.PurposeCategory#"))

结果:

enter image description here

解决方法

你可以用 css:

.k-multiselect-wrap {
  height: 25px;
}

.k-multiselect-wrap li {
   font-size: 8px;
}

.k-multiselect-wrap .k-input {
  font-size: 10px;
}

.k-list .k-item {
  font-size: 10px;
}

示例:MultiSelect style