NO BUG: Icon element, svg icon bug

Browser: Chrome 120
OS: Windows

Hi

I am using SVG icon in icon element. After selecting the SVG icon, I set its width and height and then set the padding for it in the style tab. The problem is that in this situation, applying padding causes the icon size to decrease. Whereas if I use a non-SVG icon, this problem does not exist.

Hi @jolia,

Thank you for your report, but I’m not sure how this counts as a bug :eyes: that’s just how SVG works.

thank you @charaf, But what is your proposed solution? Because this problem does not exist in Elementor. Is there a difference?

An SVG element with a fixed height and width and padding behaves the same way no matter the tool. What’s the issue so I can propose a solution? Can you share a URL and what you’re trying to achieve?

Please watch the video below. Using padding in svg icons makes the icon size smaller. It doesn’t matter if the svg icon is in the svg element or the icon widget.

Wrap the icon in inline-block and set the padding and background.
In the example, you first select an icon from the font library, and then try the same thing but with an svg icon. It is not the same.