скрыть текст в ячейке таблицы (кнопка и текст), когда кнопка внутри ячейки таблицы получает фокус

Question

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

вот мое демо

Answer 1

Вы не можете решить эту проблему одним только CSS в случае «фокуса», поскольку текст (вы говорили о «помощи», верно?) Не является дочерним элементом вашей кнопки. Я бы предложил использовать для этого JS или переместить текст / изображение внутри кнопки.

<button><span>Help</span></button>

Тогда вы можете использовать CSS, чтобы скрыть текст, когда кнопка выглядит следующим образом:

button:focus span { display: none; }

Но я не уверен, что это все еще делает то, что вы хотите.