Code change:
<div style="width: 100%; text-align: center;"> <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" width="520" height="170" aria-hidden="true" alt="Diagram showing the possible paths for 2 by 2 and 4 by 3 rectangles"> <style> <del> .g { fill: none; stroke: #ccc } .s, .s2 { fill: #bff; stroke: black; fill-opacity: .4 } .s2 { fill: #fbf } .d { stroke:black; fill:none} </del> <ins> .diagram-g { fill: none; stroke: #ccc } .diagram-s, .diagram-s2 { fill: #bff; stroke: black; fill-opacity: .4 } .diagram-s2 { fill: #fbf } .diagram-d { stroke:black; fill:none} </ins> </style> <del> <defs>	<g id="m"> <g id="h4"><g id="h2"> <path id="h" d="m0 10h 640" class="g"/> <use xlink:href="#h" transform="translate(0,20)"/></g> <use xlink:href="#h2" transform="translate(0, 40)"/></g> <use xlink:href="#h4" transform="translate(0,80)"/> <g id="v8"><g id="v4"><g id="v2"> <path id="v" d="m10 0v160 m 20 0 v-160" class="g"/> <use xlink:href="#v" transform="translate(40,0)"/></g> <use xlink:href="#v2" transform="translate(80,0)"/></g> <use xlink:href="#v4" transform="translate(160,0)"/></g> <use xlink:href="#v8" transform="translate(320,0)"/></g> <path id="b" d="m0 0h80v60h-80z" class="s"/> </del> <ins> <defs> <g id="diagram-m"> <g id="diagram-h4"> <g id="diagram-h2"> <path id="diagram-h" d="m0 10h 640" class="diagram-g"/> <use xlink:href="#diagram-h" transform="translate(0, 20)"/> </g> <use xlink:href="#diagram-h2" transform="translate(0, 40)"/> </g> <use xlink:href="#diagram-h4" transform="translate(0, 80)"/> <g id="diagram-v8"> <g id="diagram-v4"> <g id="diagram-v2"> <path id="diagram-v" d="m10 0v160 m 20 0 v-160" class="diagram-g"/> <use xlink:href="#diagram-v" transform="translate(40, 0)"/> </g> <use xlink:href="#diagram-v2" transform="translate(80, 0)"/> </g> <use xlink:href="#diagram-v4" transform="translate(160, 0)"/> </g> <use xlink:href="#diagram-v8" transform="translate(320, 0)"/> </g> <path id="diagram-b" d="m0 0h80v60h-80z" class="diagram-s"/> </ins> </defs> <del> <g transform="translate(.5,.5)"> <use xlink:href="#m"/> <g transform="translate(10,10)"> <path d="m0 0v40h40v-40z" class="s2"/><path d="m20 0v40" class="d"/> <path d="m60 0v40h40v-40z" class="s2"/><path d="m60 20h40" class="d"/> <g transform="translate(120, 0)"> <use xlink:href="#b"/><path d="m0 20h40v20h40" class="d"/></g> <g transform="translate(220, 0)"> <use xlink:href="#b"/><path d="m0 40h40v-20h40" class="d"/></g> <g transform="translate(320, 0)"> <use xlink:href="#b"/><path d="m20 0v40h20v-20h20v40" class="d"/></g> <g transform="translate(420, 0)"> <use xlink:href="#b"/><path d="m60 0v40h-20v-20h-20v40" class="d"/></g> <g transform="translate(20, 80)"> <use xlink:href="#b"/><path d="m40 0v60" class="d"/></g> <g transform="translate(120, 80)"> <use xlink:href="#b"/><path d="m60 0v20h-20v20h-20v20" class="d"/></g> <g transform="translate(220, 80)"> <use xlink:href="#b"/><path d="m20 0v20h20v20h20v20" class="d"/></g> <g transform="translate(320, 80)"> <use xlink:href="#b"/><path d="m0 20h20v20h20v-20h20v20h20" class="d"/></g> <g transform="translate(420, 80)"> <use xlink:href="#b"/><path d="m0 40h20v-20h20v20h20v-20h20" class="d"/></g> </g></g> </svg> </div> </del> <ins> <g transform="translate(.5, .5)"> <use xlink:href="#diagram-m"/> <g transform="translate(10, 10)"> <path d="m0 0v40h40v-40z" class="diagram-s2"/> <path d="m20 0v40" class="diagram-d"/> <path d="m60 0v40h40v-40z" class="diagram-s2"/> <path d="m60 20h40" class="diagram-d"/> <g transform="translate(120, 0)"> <use xlink:href="#diagram-b"/> <path d="m0 20h40v20h40" class="diagram-d"/> </g> <g transform="translate(220, 0)"> <use xlink:href="#diagram-b"/> <path d="m0 40h40v-20h40" class="diagram-d"/> </g> <g transform="translate(320, 0)"> <use xlink:href="#diagram-b"/> <path d="m20 0v40h20v-20h20v40" class="diagram-d"/> </g> <g transform="translate(420, 0)"> <use xlink:href="#diagram-b"/> <path d="m60 0v40h-20v-20h-20v40" class="diagram-d"/> </g> <g transform="translate(20, 80)"> <use xlink:href="#diagram-b"/> <path d="m40 0v60" class="diagram-d"/> </g> <g transform="translate(120, 80)"> <use xlink:href="#diagram-b"/> <path d="m60 0v20h-20v20h-20v20" class="diagram-d"/> </g> <g transform="translate(220, 80)"> <use xlink:href="#diagram-b"/> <path d="m20 0v20h20v20h20v20" class="diagram-d"/> </g> <g transform="translate(320, 80)"> <use xlink:href="#diagram-b"/> <path d="m0 20h20v20h20v-20h20v20h20" class="diagram-d"/> </g> <g transform="translate(420, 80)"> <use xlink:href="#diagram-b"/> <path d="m0 40h20v-20h20v20h20v-20h20" class="diagram-d"/> </g> </g> </g> </svg> </div> </ins> # --instructions--

Related discussion:
text: Describe your problem and how to reproduce it: SVG image in the challenge description is affected by SVG logo in navbar. They share some element s, what results in malformed image in description. Changing s to make them not overlap should deal with the issue. The simplest way seems to be, to change one of the images (probably one in the challenge), for example by adding unique prefix to s. That wouldn't eliminate completely the chance for some other conflict in future, but that's probably not something to worry about much. Add a Link to the page with the problem: If possible, add a screenshot here (you can drag and drop, png, jpg, gif, etc. in this box): Current look ! Proper image !