Как сверстать — и | не обрезая и не искажая растягиванием? Возьмите крайний случай: вертикальный портрет и горизонтальная панорама и поймете что никак.
Можно выкрутиться с order и css переменными, но в будущем с поддержкой будет тяжеловато. Верстать разные версии и подключать нужный css. В плане масштабирования такой подход решает.
Просто мнение: раскурить сетки бутстрап, фундейшн, флексгрид, etc. Написать свой велосипед, сравнить все со всеми, взять ту которая подходит под конкретный проект и забыть про бутстрап.
