Changing the checkbox style

I think the default checkbox could be a little bigger so I used some CSS to change it from:
image
to

ezgif.com-gif-maker (13)

but I can’t find a way to make the text (Untitled) a little to the right.

I’m sure I’m missing some CSS setting, any ideas?

Perhaps margin-left would do the trick.

Remove your custom CSS and try this on App HTML Header

<style>
.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: 16px;
}
</style>

And just add the class checkbox-lg to the control. You can adjust the spacing with the padding-left:

On the openning event

Me.ExecuteJavaScript("$('#" + Me.ControlID + "').addClass('checkbox-lg');" )

4 Likes

Thank you Ivan, padding-left was the missing piece.