Я работал над этим фрагментом кода уже 3 дня, пытаясь выяснить, что я делаю неправильно, и я только что сдался.В настоящее время я пытаюсь добавить разделитель между моими изображениями, за исключением значка в центре, только когда в браузере или телефоне установлено значение sm или ниже.Я попытался @media, чтобы проверить ширину, я также попробовал начальную загрузку mt-md-2, но все равно он ничего не делает .. Вот мой код, я надеюсь, что я могу найти то, что мне не хватает.
<body>
<div class="container-fluid">
<div class="row">
<div class="col-lg-12 col-xs-3 margin-3">
<div class="atomix">
<img src="img\atomix.png" alt="Atomix" class="img-responsive mx-auto d-block"/>
</div>
<div class="col-lg-12 col-xs-3">
<div class="Rectangle playersOnline mx-auto d-block">
<p><span data-playercounter-ip="atomixprison.net">0</span> online</p>
</div>
</div>
</div>
</div>
<div class="col-lg-12 col-xs-3">
<div class="navBar1">
<img src="img/NavBar1.png" class="img-responsive mx-auto d-block" alt="navbar"/>
</div>
</div>
<div class="row margin-4">
<div class="col-lg-5 col-xs-3 mt-md-2">
<div class="webStore mt-md-2">
<a href="https://atomixnetwork.buycraft.net/"><img src="img/webstore.png" alt="webstore" class="mx-auto d-block img-responsive"></a>
</div>
</div>
<div class="col-lg-2 col-xs-3 margin-15">
<div class="forums">
<a href="https://www.atomixprisonmc.net/"><img src="img/forums.png" alt="forums" class="mx-auto d-block img-responsive"></a>
</div>
</div>
<div class="col-lg-5 col-xs-3 mt-md-3">
<div class="discord mt-md-3">
<a href="https://discord.gg/D63c9JM"><img src="img/discord.png" alt="discord" class="mx-auto d-block img-responsive"></a>
</div>
</div>
</div>
<script type="text/javascript" src="js\bootstrap.min.js">
</script>