.front-button {
  font-family: 'Bebas Neue';
  font-size: 20px;
  color: white;
  text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1);
}

.front-button span {
  word-spacing: 50px;
}
<div class="front-button">
  <span>
    <a href="#">CUSTOMIZE</a>
    <a href="#">DESIGNS</a>
    <a href="#">PLANS</a>
  </span>
  <a href="#">ABOUT US</a>
</div>

Я хочу отделить текст, дизайн, планы и информацию о нас, но когда я использую интервал между словами, расстояние между словами о нас также увеличивается. Я пробовал использовать диапазон и не знаю, правильно ли я его использую.

0
woopwoop 8 Окт 2021 в 19:09

2 ответа

Лучший ответ

На самом деле вы не хотите разделять отдельные слова, вы хотите иметь пространство между элементами привязки (а). Так что дайте каждому из них поля слева и справа.

.front-button {
  font-family: 'Bebas Neue';
  font-size: 20px;
  color: white;
  text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1);
}

.front-button a {
  margin: 0 20px;
}
<div class="front-button">
  <a href="#">CUSTOMIZE</a>
  <a href="#">DESIGNS</a>
  <a href="#">PLANS</a></span>
  <a href="#">ABOUT US</a>
</div>
0
A Haworth 8 Окт 2021 в 16:22

Я считаю, что использовать margin было бы лучше

.front-button {
  font-family: 'Bebas Neue';
  font-size: 20px;
  color: white;
  text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1);
}

.front-button a {
  margin-right: 50px;
}
<div class="front-button">
  <a href="#">CUSTOMIZE</a>
  <a href="#">DESIGNS</a>
  <a href="#">PLANS</a>
  <a href="#">ABOUT US</a>
</div>
0
Cedric Cholley 8 Окт 2021 в 16:19