Как уменьшить размер шрифта моего (AM/PM) в пределах , содержащих элементы времени с суффиксом AM/PM? ⇐ Html

[Гость]

У меня есть следующая настройка CSS. CSS создается с использованием JavaScript. JavaScript теперь имеет элементы CSS. Намерение состоит в том, чтобы показать время с суффиксом AM/PM. Но я бы хотел, чтобы A AM/PM в разных размерах шрифта, чтобы уменьшить шум и отвлечение от фактического времени. Интересно, что дневная маркировка (этикетка в будние дни, например, понедельник, вторник и т. Д.) Похоже, работает нормально, но не период времени./* Target the AM/PM part of the time inside .next-congregation */
#contentContainerTopLeft .next-congregation .time-period {
font-size : 0.7em !important; /* Smaller size for AM/PM */
vertical-align : super !important; /* Align slightly above the baseline */
}

/* Target the Day label in the next-congregation */
#contentContainerTopLeft .next-congregation .day-label {
font-size : 1rem; /* Smaller size for Day */
font-weight : bold; /* Optional: Make it stand out */
margin-right : 1px; /* Add spacing between Day and Time */
}

.next-congregation {
font-size : 1.3rem;
color : #FFD700;
margin-top : 1px;
}
< /code>

6:10 AM
6:44 AM

WakeupTime
6:10 AM
SA:6:00AM, SU:6:00AM


< /code>
jsfiddle < /p>
Вычисленный результат (прикрепленный скриншот) в консольном инструменте также не имеет ссылки на период времени. Заранее извиняюсь, если пост не является структурой до стандарта. alt = "" src = "https://i.sstatic.net/z4spoysm.png"/>


Подробнее здесь: https://stackoverflow.com/questions/795 ... aining-tim