UPDATE: The latest version of Bootstrap seems to be working fine for me.
I'm currently developing a website using Bootstrap 4. I've noticed that col-xs-* has been deprecated in 4.0 and the default from 0px up is now col-*. I have specified "col-6 col-md-12" but it always displays as 12 columns wide.
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<div class="container-fluid" style="height: 100%">
<div class="row trenner">
<div class="col-6 col-md-12 logout">
<button class="logout"><i class="fa fa-sign-out-alt"></i><label class="btnLbl">Logout</label></button>
</div>
<div class="col-6 text-right wagenMobil">
<ul id="drop-dummy">
<button id="cart-button"><i class="fas fa-shopping-cart"></i></button>
</ul>
</div>
</div>If I specify only "col-6" it works properly.
When I use "col-6 col-sm-6 col-md-12" it remains 12 columns wide until the breakpoint for sm, then changes to 6 and returns to 12 when the md breakpoint is reached.
"col-xs-*" is no longer effective with Bootstrap 4.
How can I make my column appear as 6 wide on xs devices?