How can I align the checkbox when using the select extension with Bootstrap 4?

How can I align the checkbox when using the select extension with Bootstrap 4?

paulh736paulh736 Posts: 4Questions: 3Answers: 0

I'm using DataTables 1.10.25 with the Bootstrap 4 styling and the Select extension.

If I have a checkbox column to select the row, I can't get the actual checkbox to line up with the rest of the row. If there's enough space to display the whole table row on a single line, the checkbox is too low down

and if the table is narrowed to the point where the row content has to take up two lines, the checkbox is too high up

I'd just like the checkbox to be vertically centered on the row. I've put together a little example.

http://live.datatables.net/nocaduxo/1/edit?html,js,output

Is it something I've done in my code?

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    This SO thread has the answer,

    .select-checkbox::before{
      top: 40% !important
    }
    

    See updated example here,

    Colin

  • paulh736paulh736 Posts: 4Questions: 3Answers: 0

    Brilliant, thanks for your help!

Sign In or Register to comment.