The top part of my checkbox do not word anymore after resizing it and resetting materialize.
Here is sample code:
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<style>
[type="checkbox"].reset-checkbox,
[type="checkbox"].reset-checkbox:checked,
[type="checkbox"].reset-checkbox:not(checked) {
opacity: 1;
position: relative;
}
[type="checkbox"].reset-checkbox+span::before,
[type="checkbox"].reset-checkbox+span::after,
[type="checkbox"].reset-checkbox:checked+span::before,
[type="checkbox"].reset-checkbox:checked+span::after {
display: none;
}
[type="checkbox"].reset-checkbox+span:not(.lever) {
padding-left: 0px;
}
</style>
</head>
<body>
<form action="">
<label><input type="checkbox" class="reset-checkbox" style="width:20px;height:20px;" checked="checked" name="firstCheck"/></label>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
</body>
Here is the jsfiddle for you to try to click the top part of the checkbox if you want: https://jsfiddle.net/j4oxgmtc/
Any idea or solution?
Thank you!
Aucun commentaire:
Enregistrer un commentaire