Just today I’ve got to grips with embedding SVG… But the issue I’ve now got is that it’s creating a line beneath the logo that I can’t seem to get rid of! I can’t find a reason for it in webflow, and I can’t find a reason for it in he SVG code (I’ve tinkered with it a lot!)
I’ve tried work-arounds such as adding negative margins and so on, but that doesn’t work when the site is scaled on different sized screens; eventually the gap shows back up, or crops part of the logo.
This is because inline-block elements (like <svg> and <img> ) are recognised and treated as text. This mean they sit on the text baseline. The extra space you are seeing is the space left to accommodate character descenders (the tail on ‘y’, ‘g’ etc).
