Как сделать «output» невидимым, пока в нём не будет какое-либо значение?

Question

[Алексей Хацер]

У меня есть ссылка на Сodepen, там вы можете посмотреть на мой код, где я делаю простой калькулятор по шаблону из интернета. JS пока что не владею. Хотел спросить, можно ли с помощью одного только CSS Сделать "output" невидимым, пока мы не сделаем какой-либо подсчёт. Пока мы не попытаемся вывести число, "output" будет выглядеть, как тонкая розовая полоса снизу посередине макета.

Ссылка на код → https://codepen.io/hasser/pen/abGyaOr

P.s. Кнопка "copy" пока не работает, можете даже не пробовать копировать что-либо. Заглушка для использования только чисел тоже пока не работает.

Заранее, спасибо.

Answer 1

[Danny Arty]

#result{
    font-size: 30px;
    color: #fff;
    border: 1px #000;
    border-radius: 10px;    
    background-color: #ff715b;
    border-style: none;   
}
#result:not(:empty) {
    padding: 10px;
    box-shadow: 5px 5px 5px #e4887a;
}

Comments

[Mike]

У вас опечатка в слове empty

[Danny Arty]

Mike, благодарю