How to pin svg?

Question

css

Hello.
1. You need to press this illustration to the block so that they are as one. What causes this gap of several pixels? It's definitely not in the picture itself.
2. Can I insert this svg through img src or background-image and keep the same position and, most importantly, make the illustration stretch in width?
codepen.io/anon/pen/OMrMbg

Answer 1

It's just a space, because svg has display
inline

#svg
  display block

codepen.io/Zoxon/pen/wMRMjy

Answer 2

If the SVG is written inline i.e. the code itself is written in HTML
The structure of the tree house: Block 1 in it Block 2, inside Block 2 is the SVG image code.
Parent (Block 1) we write
position: relative;
-----------------------------------------------------
Block (Block 2) in which SVG lies we write
position: absolute;
bottom: 0px;
-----------------------------------------------
The SVG itself CSS we write
svg {
width: 100%;
display:block;
}
-----------------------------------------------
In code SVG images in HTML next to the viewBox property We write
preserveAspectRatio='none'