inside-inline-block.html | Explore in Territory

<!DOCTYPE html>
<title>SVG inside inline block</title>
<style>
    body { margin: 0 }
    span { display: inline-block }
    div {
        width: 100px;
        background: green;
        position: absolute;
        top: 0;
        left: 0
    }
    .cover1 {
        top: 0;
        left: 0;
        height: 150px
    }
    .cover2 {
        top: 50px;
        left: 100px;
        height: 100px
    }
    svg {
        width: 100%;
        height: 100%
    }
</style>
<span>
    <svg width="100">
        <rect width="100%" height="100%" fill="red"/>
    </svg>
</span><span>
    <svg width="100" height="100" style="width: 100%; height: 100%;">
        <rect width="100%" height="100%" fill="red"/>
    </svg>
</span>
<div class="cover1"></div>
<div class="cover2"></div>

chromium/third_party/blink/web_tests/svg/in-html/inside-inline-block.html