Elementy w jednym rzędzie

Do układu jednowymiarowego zwykle używam Flexboxa.

.toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

Przy domyślnym kierunku row, align-items wyrównuje elementy w pionie, a justify-content rozmieszcza je wzdłuż rzędu.

Doprecyzowanie: jeżeli rząd ma nigdy się nie łamać, zostawiam nowrap, ale muszę rozwiązać przepełnienie. Grid lepiej nadaje się do układów, w których kontroluję wiersze i kolumny.

Pułapka: używanie spacji lub sztywnych marginesów do ustawienia elementów psuje się wraz ze zmianą tekstu.