Checkboxes size and alignment

[manugi]

Hello, I updated to the rel. 4.0.0 of Porto Admin. Can you help me to make the checkboxes bigger and centered in the column?
You can check the behavior in the following image:
https://www.smartware.biz/img/temp/checkboxes.png

Thank you in advance,
Emanuele Giglio

---

Template Version: 4.0.0

[Support]

Hi, you can add the class text-center in the HTML:

<div class="col-lg-6 text-center">
	<div class="custom-control custom-checkbox">
	  <input type="checkbox" class="custom-control-input" id="checkbox-1" checked="">
	  <label class="custom-control-label" for="checkbox-1">Regular checkbox</label>
	</div>

	 <!-- Default checked -->
	<div class="custom-control custom-checkbox checkbox-lg">
	  <input type="checkbox" class="custom-control-input" id="checkbox-2" checked="">
	  <label class="custom-control-label" for="checkbox-2">Large checkbox</label>
	</div>

		 <!-- Default checked -->
	<div class="custom-control custom-checkbox checkbox-xl">
	  <input type="checkbox" class="custom-control-input" id="checkbox-3" checked="">
	  <label class="custom-control-label" for="checkbox-3">Extra large checkbox</label>
	</div>
</div>

CSS: (css/custom.css)

.checkbox-lg .custom-control-label::before, 
.checkbox-lg .custom-control-label::after {
  top: .8rem;
  width: 1.55rem;
  height: 1.55rem;
}

.checkbox-lg .custom-control-label {
  padding-top: 13px;
  padding-left: 6px;
}


.checkbox-xl .custom-control-label::before, 
.checkbox-xl .custom-control-label::after {
  top: 1.2rem;
  width: 1.85rem;
  height: 1.85rem;
}

.checkbox-xl .custom-control-label {
  padding-top: 23px;
  padding-left: 10px;
}

---

[Author]

Posts