Привет. Подскажите как правильно объявить svg объект, чтобы он занял все свободного пространство экрана и при этом не "вылезал" вниз. Например у меня есть svg (большой код, т.к. в ней просто 17 одинаковых элементов, которые расположены по главной горизонтали):
<svg xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xlink="http://www.w3.org/1999/xlink" baseProfile="full" height="1088px" style="background:#FFFFFF" version="1.1" width="1088px">
<defs>
<style type="text/css">
.default_default {
fill: #E4801B;
stroke: #000000;
stroke-width: 1.0px;
}
</style>
</defs>
<g id="root" transform="translate(0,0)">
<g id="Auto" class="default_default" transform=" translate(0,0) rotate(0,32,32)">
<g id="layer0">
<rect y="24" x="0" height="16" width="64" id="c0trumpet"/>
<rect y="26" x="3" height="12" width="2" id="c0flow0"/>
<rect y="26" x="11" height="12" width="2" id="c0flow1"/>
<rect y="26" x="19" height="12" width="2" id="c0flow2"/>
<rect y="26" x="27" height="12" width="2" id="c0flow3"/>
<rect y="26" x="35" height="12" width="2" id="c0flow4"/>
<rect y="26" x="43" height="12" width="2" id="c0flow5"/>
<rect y="26" x="51" height="12" width="2" id="c0flow6"/>
<rect y="26" x="59" height="12" width="2" id="c0flow7"/>
</g>
</g>
<!-- тут еще 15 групп с id="Auto"-->
<g id="Auto" class="default_default" transform=" translate(960,960) rotate(0,32,32)">
<g id="layer0">
<rect y="24" x="0" height="16" width="64" id="c15trumpet"/>
<rect y="26" x="3" height="12" width="2" id="c15flow0"/>
<rect y="26" x="11" height="12" width="2" id="c15flow1"/>
<rect y="26" x="19" height="12" width="2" id="c15flow2"/>
<rect y="26" x="27" height="12" width="2" id="c15flow3"/>
<rect y="26" x="35" height="12" width="2" id="c15flow4"/>
<rect y="26" x="43" height="12" width="2" id="c15flow5"/>
<rect y="26" x="51" height="12" width="2" id="c15flow6"/>
<rect y="26" x="59" height="12" width="2" id="c15flow7"/>
</g>
</g>
</g>
</svg>
Auto.html выглядит следующим образом:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<div class="menu">
<a href="Auto.html">Untitled</a>
<div>
<object id="AutoId" type="image/svg+xml" data="Auto.svg"></object>
</div>
<script type="text/javascript" src="Auto.js"></script>
</div>
</body>
</html>
Таким образом я получаю страницу, которая представлена на рисунке 1. Как видно, не вся svg поместилась на страницу. А хотелось бы получить результат как на второй картинке, т.е. уместить всю svg в область под <a>Untitled</a> так, чтобы вниз страница не прокручивалась.