Должно ли содержимое SVG быть видно за пределами встроенного по умолчанию? [закрытый]

в прошлом я ответил на вопрос о том, "кто был неправ" в отношении изображений SVG, которые не были "обрезаны" (overflow: hidden) в IE9, где это сделали все остальные поддерживающие браузеры. Ответ здесь.

сегодня, просматривая шаблон HTML5 снова, я заметил, что они утверждают, что они "[правильно] переполнение не скрыто в IE9" С этот кусок кода:

svg:not(:root) { overflow: hidden; }

Я ищу кого-то, чтобы подтвердить или опровергнуть мои оригинальные исследования, указывая на некоторые другие примечания в спецификациях HTML5 или SVG. Я ничего не могу найти, но хочу быть уверенным, что ничего не упустил.

лучшее, что я могу найти, это то, что они пытаются применить правило 7 здесь, но это должно применяться только к документу SVG, например, через img тег или при загрузке напрямую.

9
css html html5boilerplate svg w3c

2 ответов

спецификация SVG имеет это, чтобы сказать:http://www.w3.org/TR/SVG/styling.html#UAStyleSheet

похоже на то, что Firefox и Chrome не делают?

4

ваш первоначальный ответ кажется мне разумным, используя указанные вами основания (в частности, пятый и седьмой пунктыспец).

кажется невероятно маловероятным, что IE является правильным, а Webkit и Firefox-нет. Однако, как вы подозреваете, седьмой пункт is дифференцирующим фактором.

если вы загружаете этот тест в Chrome и используйте инструменты разработчика для проверки SVG, вы будете см.:

(user agent stylesheet)

svg:not(:root), symbol, image, marker, pattern, foreignObject {
  overflow: hidden;
}

если вы включите "Show User Agent CSS" в Firebug, вы увидите это правило в Firefox:

svg.css (line 49) <System>

svg:not(:root), symbol, image, marker, pattern, foreignObject {
  overflow: hidden;
}

наконец, если вы изменить тестовый случай, чтобы добавить svg { overflow:hidden } тогда IE визуально соответствует другим браузерам.

таким образом, мне кажется, что все три браузера ведут себя в соответствии со спецификацией, но Chrome / Safari / FF все имеют Правила UA, которые более точно соответствуют тому, что ожидает большинство пользователей.

если бы я мог оставить достаточно хорошо в покое, вот где я остановил бы этот ответ.

однако, если вы отредактируйте тестовый набор, чтобы добавить svg { overflow:visible }, как Chrome, так и Firefox не "правильно" показывают переполненное содержимое. Я не уверен, как решить эту точку данных с остальной частью этого ответа. :/

4