'Resizing Bootstrap toggle switch

I am using a bootstrap toggle switch and it is very small at the moment I want to make it bigger. Here is the only code I used to make this no further css used then the classes of bootstrap.

<div class="custom-control custom-switch">
   <input type="checkbox" class="custom-control-input" id="customSwitches">
   <label class="custom-control-label" for="customSwitches">Fullscreen</label>
</div>

Please help me resize this switch if its possible.

I tried using height and width css variables but they did no good as far as resizing the element.

htmlcssbootstrap-4


Solution 1:[1]

You can try this. Not sure if this is what you mean

label.custom-control-label {font-size:30px;}

.custom-control>input {width:20px;height:20px}
<div class="custom-control custom-switch">
   <input type="checkbox" class="custom-control-input" id="customSwitches">
   <label class="custom-control-label" for="customSwitches">Fullscreen</label>
</div>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Crystal

Related Questions