Вопрос №66905 от пользователя Andrew Kang в испытании «Timeline»

Andrew Kang

https://ru.hexlet.io/code_reviews/585021 Привет Никита вроде бы я прошел задания)но посмотрев на ответ учителя у меня по другому( Вот такой вопрос! Допустим у меня есть timeline где я через псевдоэлемент задал вертикальную линию! Далее я круги задал через элемент списков! то есть они не зависимо располагаются друг от друга! я подбил на глаз left -59px но как это сделать системно! не на глаз?)

1 0

Nikita Mikhaylov

Здравствуйте

Тут всегда стоит исходить из различных значений. Например, почему в решении учителя -60px? Это значение считается из нескольких параметров:

  1. Ширина элемента. Круг имеет ширину 20px. Но нам нужно отцентрировать элемент относительно линии, поэтому можно поделить на два и получить 10px
  2. Внутренний отступ от левого края списка. Этот отступ 50px

Вот 50 + 10 и дали те 60 пикселей, которые указаны. Там ещё компенсация у самой линии, но это уже скорее истории на глаз. Обычно стоит брать во внимание ширину/высоту элемента и все отступы, которые присутствуют. Зачастую размер элемента ещё будет делиться на два, так как нам нужен центр элемента, а не его край

0

Используйте Хекслет по максимуму!

  • Задавайте вопросы по уроку
  • Проверяйте знания в квизах
  • Проходите практику прямо в браузере
  • Отслеживайте свой прогресс

Зарегистрируйтесь или войдите в свой аккаунт

Даю согласие на обработку персональных данных, соглашаюсь с «Политикой конфиденциальности» и «Условиями оказания услуг»

Рекомендуемые программы

С нуля до разработчика. Возвращаем деньги, если не удалось найти работу.

Иконка программы Фронтенд-разработчик
Профессия
Разработка фронтенд-компонентов веб-приложений
7 июля 10 месяцев
Иконка программы Python-разработчик
Профессия
Разработка веб-приложений на Django
7 июля 10 месяцев
Иконка программы PHP-разработчик
Профессия
Разработка веб-приложений на Laravel
7 июля 10 месяцев
Иконка программы Node.js-разработчик
Профессия
Разработка бэкенд-компонентов веб-приложений
7 июля 10 месяцев
Иконка программы Fullstack-разработчик
Профессия
Новый
Разработка фронтенд и бэкенд компонентов веб-приложений
7 июля 16 месяцев
Иконка программы Верстальщик
Профессия
Вёрстка с использованием последних стандартов CSS
в любое время 5 месяцев
Иконка программы Java-разработчик
Профессия
Разработка приложений на языке Java
7 июля 10 месяцев
Иконка программы Разработчик на Ruby on Rails
Профессия
Создает веб-приложения со скоростью света
7 июля 5 месяцев