Bootstrap4では、「col-xs-*」ではなく、「col-*」を使用する

Bootstrap3では、class名prefixを、「col-xs-**」と記載することで、スマホ表示（767px以下）での表示設定を行う事ができましたが、Bootstrap4で同様に、スマホ縦表示（575px以下）の表示指定を「col-xs-**」と記載すると正しく動作せず、すべて「col-xs-12」として動作してしまいます。

このような場合、Bootstrap4では「col-*」と記載する（-xsは記載しない）と、グリッドシステムが正しく動作しますので、参考にしてみてください。