0

How can I customise the checkbox by using css? I am not able to change the html because am not allowed to customise the html in my company. I can only add css to the application. So, if there's any way that I can customise the checkbox using pure css.

here is the code created from AngularJS

  <label class="form-lbl ng-binding ng-scope" ng-repeat="item in chkdatasource.rows">
        <input class="form-control form-chkgrp ng-scope ng-pristine ng-valid ng-valid-required ng-touched" dirctrl="" type="checkbox" checklist-value="item.CODE" ng-disabled="Disable" ng-required="ctl.required" ng-change="Handle_Change();" ng-model="checked" checklist-model="data[ctl.target_column]" style=""> License
    </label>
Nithya Rajan
  • 4,722
  • 19
  • 30
  • Your question is not clear to me, if you want to add some style, can't you just add a class and write the style in it? – Aayushi Jain Jun 19 '17 at 04:35
  • i can override classes which are already added. is there anyway to customize checkbox with only css – Nithya Rajan Jun 19 '17 at 05:31
  • I guess you are saying answer by yourself, you can add css in those classes and it will work, what customization do you need anyway? – Aayushi Jain Jun 19 '17 at 05:33
  • You can style the checkbox easily, what you need to do is select the checkbox. To select something you must identify it, so the input element must have a CSS class or id that enables you to identify it. – Matt Jun 19 '17 at 05:33
  • Is there any kind of `element` arround the checkbox? I might be able to help you if there is. Post a little bit more `HTML`. – Red Jun 19 '17 at 06:52

1 Answers1

1

I created a JSFiddle to give you an idea to tackle your problem. If you have jQuery integrated with your angular project you can get the commented part of my code. Else use the first part of it:

var pureElement = angular.element(document.getElementsByName("WAIVE_CHARGES"));
pureElement.css('width','30px');
pureElement.css('height','26px');

Also, styling a checkbox can be challenging. You may want to have a look at this popular link in SO as well:

How to style checkbox using CSS?

Sahan Serasinghe
  • 1,591
  • 20
  • 33