Почему примеси less из bootstrap работают некорректно?

Question

[Legioner911]

Всем доброго времени суток!
Хорошие люди с тостера подсказали мне каким образом можно использовать bootstrap, при разработке адаптивного сайта, без добавления кучи классов в html(Возможна ли адаптивная разработка сайта без использования большого количества классов?)(спасибо им :) ). Это возможно при помощи препроцессоров с использованием примесей. Но когда я начал тестировать данный метод столкнулся с проблемой, которую не могу решить уже несколько часов.
Собственно суть проблемы:
Есть файл bootstrap.less
Есть файл мой main.less (в который импортирован@import (reference)"less/bootstrap.less"; )

При добавлении в html класса например "col-xs-2", отображаются колонки нормально

А вот при добавлении примеси в main.less отображается вот так

Пример кода

@import (reference)"less/bootstrap.less";
.container{
	background: #ccc;
	.article-row{
		.row;
		.article{
			.col-xs-2;
   // причём если сюда добавить ещё .col-md-2; то при компиляции вылазит ошибка
			background: blue;
			border: 1px solid #222;
			height: 200px;
		}
	}
}

Заметил при сравнении, что по какой то причине отсутствует float: left;. Но как примешивание, может влиять на свойства, я же просто миксую его в main.less ничего не меняя.
По идее, всё должно работать так, как работает когда я добавляю этот класс в html. Но нет же... Да и ещё плюс к этому я два класса не могу добавить в примеси. В таком случае адаптацию настроить не смогу.

Товарищи профессионалы, подскажите , что я делаю не так? И как примешать несколько классов bootstrap сетки, что бы не было ошибок?

Заранее спасибо за ответ.

Answer 1

[Никита Иванов]

Про important вспомни.

Answer 2

[asdz]

Колонки делаются миксинами

.make-xs-column();
.make-md-column();
.make-lg-column();

зачем тут col-xs-2? Смотрите less файлы бутстрапа, там все понятно написано.