Как сверстать 3 колонки для планшетов из 4 колонок для пк?

Используя ваши стили при заданной в условии разметке на разрешении до 840px вы получите 4 колонки шириной 33.33333%. А при разрешении более 840px 4 колонки шириной 25%.

В разметке 4 колонки выравненные float:
col1
col2
col3
col4

Как сверстать 3 колонки для планшетов из 4 колонок для пк?

В разметке 4 колонки:
col1
col2
col3
col4

Как медиазапрос повлияет на нtml с перераспределением содержимого колонок?