Problem with position text in cell after use input checkbox

I created a table using a table generator using a online service. I needed to use the checkbox in the table. After I inserted the input checkbox in column with name "column name one", the link dropped a few pixels down. How to up the link in the case below? I tried different ways but it didn't work out. How to make that the link does not fall and remains on the same level with the text in other columns?

.divTable{
        display: table;
        width: 100%;
        table-layout: fixed;
}

.divTableRow {
    display: table-row;
}

.divTableHeading {
        background-color: #EEE;
        display: table-header-group;
}

.divTableCell, .divTableHead {
        border: 0px solid #999999;
        display: table-cell;
        padding: 0px 0px;
        vertical-align: top;
/*      width: 33%; */
}

.divTableHeading {
        background-color: #EEE;
        display: table-header-group;
        font-weight: bold;
}

.divTableFoot {
        background-color: #EEE;
        display: table-footer-group;
        font-weight: bold;
}

.divTableBody {
    display: table-row-group;
}

input[type=checkbox] {
        cursor: pointer;
        font-size: 17px;
        visibility: hidden;
        position:relative;
                display: inline-block;
        transform: scale(0.8);
         -moz-appearance: none !important;

}

input[type=checkbox]:after {
        content: " ";
        position:relative;
        top: -50%;
        background-color: #fff;
        display: inline-block;
        color: #00BFF0;
        width: 22px;
        height: 21px;
        visibility: visible;
        border: 1px solid #b0b0b0;
        padding: 0 3px;
        margin: -2px 0;
        border-radius: 8px;
        box-shadow: 0 0 15px 0 rgba(0,0,0,0.08), 0 0 2px 0 rgba(0,0,0,0.16);
         -moz-appearance: none !important;

}

input[type=checkbox]:checked:after {
        content: "\2714";
        display: unset;
        position:relative;
                display: inline-block;
        font-weight: bold;
         -moz-appearance: none !important;
        
}

<br><br>
<div class="divTable blueTable">

        <div class="divTableHeading">
        <div class="divTableRow">

        <div class="divTableHead">column name one</div>
        <div class="divTableHead">column name two</div>
        <div class="divTableHead" style="text-align: right;">column name three</div>

        </div>
        </div>

<div class="divTableBody">

<div class="divTableRow" id="price" style="height: 34px">

<div class="divTableCell"> <input type="checkbox" value="1" >&nbsp;&nbsp;<a href="orderdetails?">link</a></div> 
<div class="divTableCell">text</div>
<div class="divTableCell" id="price" style="text-align: right;">text</div>

</div>


</div></div>