Dwa elementy w jednej linii

Mam mały problem, w spanie o klasie columnName mam dwa elementy - nazwę kolumny i ikonę, jak je wyśrodkować w taki sposób, żeby ikona była po lewej stronie nazwy i były traktowane jako jeden element tzn. nie rozjeżdżały się w nagłówku tabeli?

Dałbyś przykładowy kod? Tak będzie o wiele łatwiej. Najlepiej wrzuć działający przykład na jsfiddle.net i podaj tutaj link do swojej wrzutki.

Jest wiele możliwości:

• pseudo element (:before)
• wyświetlić je jako tekst (inline-block)
• FlexBox

to takie najlepsze na początek

Ja bym polecał Flexbox jak @TomRiddle.

Ale z drugiej strony, u mnie na Firefoksie 68 na Linuksie poniższe elementy zarówno nie rozjeżdżają się, jak i są wyśrodkowane:

<table>
  <tr>
    <th>
      <span>
        <img src="jakaś_ikona" />
        <span>Tytuł kolumny</span>
      </span>
    </th>
  </tr>
  <tr>
    <td>
      Coś tam w kolumnie Coś tam w kolumnie Coś tam w kolumnie
    </td>
  </tr>
</table>

Tu fiddle: https://jsfiddle.net/t3gm62fy/

Może podaj swój kod, jak wspomniał @cerrato.