`col-xs-*` not working in Bootstrap 4
They dropped XS because Bootstrap is considered a mobile-first development tool. It's default is considered xs and so doesn't need to be defined.
col-xs-*
have been dropped in Bootstrap 4 in favor of col-*
.
Replace col-xs-12
with col-12
and it will work as expected.
Also note col-xs-offset-{n}
were replaced by offset-{n}
in v4.
I just wondered, why col-xs-6
did not work for me but then I found the answer in the Bootstrap 4 documentation. The class prefix for extra small devices is now col-
while in the previous versions it was col-xs
.
https://getbootstrap.com/docs/4.1/layout/grid/#grid-options
Bootstrap 4 dropped all col-xs-*
classes, so use col-*
instead. For example col-xs-6
replaced by col-6
.