Css для удаления текстовой тени для выделения/выделения текста (mozilla)

Я использую текстовые тени для большинства текстовых сайтов, но когда вы выделяете/выбираете текст - текст выглядит нечетким. Поэтому, чтобы удалить тень текста, я использую этот css из здесь.

::-moz-selection,
::-webkit-selection,
::selection {
    text-shadow: none;
    background: #333;
    color: #fff;
}

Проблема в том, что по какой-то причине moz-selection, похоже, не работает (больше?) в mozilla (Firefox).

Здесь jsFiddle

Ответы

Ответ 1

Похоже, проблема заключалась в группировании нескольких правил CSS (для конкретного поставщика css) вместе в сочетании с псевдоэлементом:: selection.

Я изначально думал, что достаточно написать каждый оператор в отдельной строке.

Я ошибся.

Итак, если я заменю этот код:

::-moz-selection,
::selection {
    text-shadow: none;
    background: #333;
    color: #fff;
}

.. С помощью этого кода:

::-moz-selection
{
    text-shadow: none;
    background: #333;
    color: #fff;
}
::selection {
    text-shadow: none;
    background: #333;
    color: #fff;
}

.... bingo, он работает.

FIDDLE

Поддержка также очень хороша (для рабочего стола): Caniuse

Кроме того, если вы используете LESS или SASS - вы можете легко написать mixin, чтобы обойти репликацию.

Ответ 2

Ниже описывается в Mozilla Developer Network:

Хотя этот псевдоэлемент был в проектах CSS Selectors Level 3, он был удален во время этапа рекомендации кандидата, поскольку оказалось, что его поведение было недоопределено, особенно с вложенными элементами, и интероперабельность не была достигнута (на основе при обсуждении в списке рассылки W3C Style).

Псевдоэлемент:: selection в настоящее время не находится ни в одном модуле CSS на стандартной дорожке. Он не должен использоваться в производственных средах.