Non-transparent white background but keep borders on table

Question

I have almost successfully made the left columns of my table sticky, so that the rest can be scrolled. This, however, has created a new problem: the table background is white, which means scrolled cells transpire underneath the sticky cells (see screenshot 1). To resolve this, I've made the background of the sticky cells non-transparent by using background-color: rgba(255, 255, 255, 1.0);. But this also removes the borders of the sticky cells (see screenshot 2). Both variants are ugly.

I've tried adding border:1px solid #cdcdcd; (even adding !important) to the sticky cells but the borders are still invisible. Any suggestions?

Here's the entire formatting applied to the table:

div#scrollable {
   overflow-x: scroll;
}
table#stats {
   border-collapse:collapse;
   width:100%;
}
table#stats th.sticky, td.sticky {
   position: -webkit-sticky; /* for Safari */
   position: sticky;
   left: 0;
}
table#stats td.sticky {
   background-color: rgba(255, 255, 255, 1.0);
   border:1px solid #cdcdcd !important;
}
table#stats tr#means {
   background-color:#ddffd5;
}
table#stats td.stats {
   border:1px solid #cdcdcd;
}

transparent sticky cells non-transparent sticky cells

Answer 1

I did not find any other solution than this

th.sticky:after, td.sticky:after{
    content : "";
    position: absolute;
    bottom: 0;
    display: block;
    width: 100%;
    height: 1px;

    background-color: #cdcdcd;
}

EDIT : Other solution here Stack overflow post