Как разместить элементы в одну строку с одинаковым отступом между ними

Используй Flexbox или Grid для равномерного распределения элементов.

Flexbox вариант:

.container {
  display: flex;
  justify-content: space-between; /* или space-around */
}

Это автоматически распределит элементы с равными отступами.

Grid вариант:

.container {
  display: grid;
  grid-auto-flow: column;
  gap: 20px; /* одинаковый отступ */
}

Важно:

• Для Flexbox space-between оставит отступы только между элементами, а space-around добавит отступы по краям.
• В Grid gap задает фиксированный отступ между элементами.
• Убедись, что у родителя нет ограничений по ширине, иначе элементы перенесутся.