Мобильная версияЯ пытаюсь сделать стрелку, указывающую направление, выбранное геймпадом. Я стилизовал свою стрелку вот так: Скрин моей стрелочки, как картинка лучше 1000 слов
Когда джойстиком задается угол, все вращается под этим углом (rotateприменяется к классу cercle). Таким образом, вершина черного треугольника указывает направление. Красиво, не так ли?
Но ! вы можете увидеть номер посередине. Это важная информация (настройка ШИМ, которую я отправляю по TCP, но не в эту тему). И я хочу, чтобы она была в центре круга для... стиля?
Моя проблема: я центрировал это число с помощью флексбокса, а затем, когда весь круг вращается, число тоже вращается! Это ужасно ! Как я могу избежать этого?
Пожалуйста, найдите CSS и HTML ниже:
1306
.cercle { порядок: 0; граница-радиус: 50%; высота: 80%; соотношение сторон: 1/1; фон: линейный градиент (45 градусов, розовый, красный); дисплей: гибкий; поворот: 0 градусов; переход: 350 мс; .середина{ граница-радиус: 50%; высота: 92%; ширина: 92%; цвет фона: черный; выровнять-сам: центр; маржа: авто; дисплей: гибкий; гибкое направление: столбец; выровнять-элементы: по центру; оправдание-содержание: центр; } .треугольник { ширина: 0 пикселей; стиль границы: сплошной; ширина границы: 20 пикселей; border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) черный rgba(0, 0, 0, 0) ; левая граница: 44,4%; верхняя маржа: -7,2%; фон: rgba(0, 0, 0, 0); позиция: абсолютная; } #vitesse{ /*...*/ } } Вы, наверное, догадались, здесь нет критического вопроса, только эстетический. Я пытался применить к этому числу противоположное вращение, но результат неудовлетворительный (похоже на "обрезание"). Я думаю, лучший вариант - запретить вращение числа... выведя его из кругов? Но мне придется держать его внутри, если я хочу, чтобы число динамически оставалось в центре круга.
Спасибо за помощь!
