diff --git a/javascript/packages/linter/src/rules/html-head-only-elements.ts b/javascript/packages/linter/src/rules/html-head-only-elements.ts
index c5c624da..ac2cfcdf 100644
--- a/javascript/packages/linter/src/rules/html-head-only-elements.ts
+++ b/javascript/packages/linter/src/rules/html-head-only-elements.ts
@@ -23,6 +23,7 @@ class HeadOnlyElementsVisitor extends BaseRuleVisitor {
if (!this.insideBody) return
if (!isHeadOnlyTag(tagName)) return
if (tagName === "title" && this.insideSVG) return
+ if (tagName === "style" && this.insideSVG) return
if (tagName === "meta" && this.hasItempropAttribute(node)) return
this.addOffense(
diff --git a/javascript/packages/linter/test/rules/html-head-only-elements.test.ts b/javascript/packages/linter/test/rules/html-head-only-elements.test.ts
index 8d1a68e4..fe083b88 100644
--- a/javascript/packages/linter/test/rules/html-head-only-elements.test.ts
+++ b/javascript/packages/linter/test/rules/html-head-only-elements.test.ts
@@ -332,6 +332,26 @@ describe("html-head-only-elements", () => {
`)
})
+ test("allows style element inside SVG", () => {
+ expectNoOffenses(dedent`
+
+
+
+ Hi
+
+
+
+
+
+ `)
+ })
+
test("still fails for other head-only elements inside SVG", () => {
expectError("Element `` must be placed inside the `` tag.")
expectError("Element `` must be placed inside the `` tag.")