[英]Css - Custom style on checkbox not working
First off I have a kendo grid. 首先,我有一个剑道网格。 Now I am dynamically adding a checkbox to the DataSource like below:
现在我动态地向DataSource添加一个复选框,如下所示:
var chkBox = "<input type='checkbox' id='chUpload'/><label for='chUpload'><a href='#' id='cbChoose'></a>test</label>";
var uploadedFiles =
[
{
facility: "Sunrise medical Laboratories",
documentName: "Lab Results",
documentType: "PDF",
selected: chkBox
}
];
Following are the styles implemented on the checkbox: 以下是复选框上实现的样式:
input[type="checkbox"]
{
display:none;
}
input[type="checkbox"] + label a
{
display:inline-block;
width:14px;
height:14px;
margin:-1px 4px 0 0;
vertical-align:middle;
background:url('../images/checkBox.png') right top no-repeat;
cursor:pointer;
float:right;
margin-top:10px;
margin-right:10px;
}
input[type="checkbox"]:checked + label a
{
background:url('../images/checkBox.png') -1px top no-repeat;
}
I found that these styles work on other checkboxes which I added to a panelbar's tabs, but in the grid, nothing is displayed.
我发现这些样式适用于我添加到面板栏选项卡的其他复选框,但在网格中,没有显示任何内容。
I have created a jsfiddle with the black boxes being the styled checkbox. 我创建了一个jsfiddle ,黑盒子是样式复选框。 I have hidden the
display:none;
我隐藏了
display:none;
in the css to see where all textboxes are. 在css中查看所有文本框的位置。 If it is in use, no check custom boxes are displayed in the grid.
如果正在使用,则不会在网格中显示检查自定义框。
Any ideas why? 有什么想法吗?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.