Why are these bootstrap columns stacking on xs displays?

2

.col-xs-* is no longer valid in Bootstrap 4. Instead you should use .col-*

In case you didn’t meant to use Bootstrap 4:

EDIT
For your second question: You will have to remove the .no-gutters on the outside row and apply the addBorder to the nested row.