| <!DOCTYPE html><!-- webkit-test-runner [ LayerBasedSVGEngineEnabled=true ] --> |
| <html> |
| <head> |
| <style> |
| .rect1 { |
| fill: blue; |
| } |
| |
| .rect2 { |
| fill: green; |
| } |
| |
| svg { |
| display: inline-block; |
| overflow: hidden; |
| } |
| |
| .show-overflow { |
| overflow: visible; |
| } |
| |
| .scaled { |
| transform: scale(2); |
| transform-origin: 0 0; |
| } |
| </style> |
| </head> |
| <body> |
| <h1>Enforce non-integer SVG location</h1> |
| <svg width="50" height="50" class="show-overflow"> |
| <rect x="0" y="0" width="50" height="50" class="rect1"/> |
| </svg> |
| <svg width="50" height="50" class="show-overflow"> |
| <rect x="0" y="0" width="50" height="50" class="rect2"/> |
| </svg> |
| <h1>Effect of overflow: hidden</h1> |
| <svg width="50" height="50"> |
| <rect x="0" y="0" width="50" height="50" class="rect1"/> |
| </svg> |
| <svg width="50" height="50"> |
| <rect x="0" y="0" width="50" height="50" class="rect2"/> |
| </svg> |
| <h1>With transformation</h1> |
| <svg width="50" height="50" class="show-overflow"> |
| <rect x="0" y="0" width="50" height="50" class="rect1"/> |
| </svg> |
| <svg width="50" height="50" class="show-overflow"> |
| <rect x="0" y="0" width="50" height="50" class="rect2"/> |
| </svg> |
| </body> |
| </html> |
