SVG into html size enlarging when it shouldn't - css

Question

It's my first time working with SVG. I set the artboard to a specific size 60 x 70 px or something close to that but when I load in the browser its huge
.st6 {
fill: none;
stroke: #4d4d4d;
stroke-miterlimit: 10
}
<nav>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 60 70" xml:space="preserve">
<path d="M54.49 70H5.51C2.47 70 0 67.53 0 64.49V5.51C0 2.47 2.47 0 5.51 0h48.98C57.53 0 60 2.47 60 5.51v58.98c0 3.04-2.47 5.51-5.51 5.51z" fill="gray" stroke="#4d4d4d" stroke-miterlimit="10"/>
<path d="M52.44 66H7.56C5.59 66 4 64.41 4 62.44V7.56C4 5.59 5.59 4 7.56 4h44.88C54.41 4 56 5.59 56 7.56v54.88c0 1.97-1.59 3.56-3.56 3.56z" fill="none" stroke="#00f" stroke-width="2" stroke-miterlimit="10"/>
<text transform="translate(11.528 19.33)" font-size="16" font-family="MyriadPro-Regular" fill="#fff">
News
</text>
<path fill="none" stroke="gray" stroke-miterlimit="10" d="M30 65V46"/>
<path class="st6" d="M5.5 46.5h49M30.5 64.5v-18"/>
</svg>
</nav>

Answer 1

Youn just need to set a width / height on your svg
svg {
width: 60px;
height: 70px;
}
<nav>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 60 70" xml:space="preserve">
<style>
.st6{fill:none;stroke:#4d4d4d;stroke-miterlimit:10}
</style>
<path d="M54.49 70H5.51C2.47 70 0 67.53 0 64.49V5.51C0 2.47 2.47 0 5.51 0h48.98C57.53 0 60 2.47 60 5.51v58.98c0 3.04-2.47 5.51-5.51 5.51z" fill="gray" stroke="#4d4d4d" stroke-miterlimit="10"/>
<path d="M52.44 66H7.56C5.59 66 4 64.41 4 62.44V7.56C4 5.59 5.59 4 7.56 4h44.88C54.41 4 56 5.59 56 7.56v54.88c0 1.97-1.59 3.56-3.56 3.56z" fill="none" stroke="#00f" stroke-width="2" stroke-miterlimit="10"/>
<text transform="translate(11.528 19.33)" font-size="16" font-family="MyriadPro-Regular" fill="#fff">
News
</text>
<path fill="none" stroke="gray" stroke-miterlimit="10" d="M30 65V46"/>
<path class="st6" d="M5.5 46.5h49M30.5 64.5v-18"/>
</svg>
</nav>
So even though you may of set the artboard in photoshop / illustrator as 60 x 70 - when it generates the SVG it doesnt actually set the width or height. So if you don't specify its size it will take up all the available space.