Applying a class to SVG
Posted: Wed May 15, 2019 10:46 pm
I'm experimenting with embedding SVG in my docs. Found a probable bug with Chemistry.
I've the following
The class "fontfab" is defined
After building with Chemistry, the SVG appears in the PDF at its viewBox size, ignoring the CSS.
Tried changing the height/width definitions to points to no avail. The CSS was still ignored.
Embedding the height/width values in the <svg> tag works but breaks my HTML output.
Is this a known bug? Is there a workaround?
I've the following
Code: Select all
<svg-container id="opt-svg">
<svg class="fontfab" fill-rule="evenodd" clip-rule="evenodd"
stroke-linejoin="round" stroke-miterlimit="1.414" viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg">
<path
d="M493.716 438.858H347.43c-7.227 0-19.49-4.256-22.424-10.86l-141.46-295.426H18.286C8.188 132.572 0 112.956 0 102.858c0-10.099 8.188-29.715 18.286-29.715h182.857c7.227 0 19.49 4.256 22.425 10.86l141.46 295.427h128.688c10.1 0 18.285 19.615 18.285 29.714 0 10.1-8.186 29.714-18.285 29.714zm0-306.286H310.858c-10.1 0-18.286-19.616-18.286-29.714 0-10.099 8.187-29.715 18.286-29.715h182.858c10.1 0 18.285 19.616 18.285 29.715 0 10.098-8.186 29.714-18.285 29.714z"
fill-rule="nonzero"/>
</svg>
</svg-container>
Code: Select all
svg.fontfab{
height: 0.8em;
width: 0.8em;
}
Tried changing the height/width definitions to points to no avail. The CSS was still ignored.
Embedding the height/width values in the <svg> tag works but breaks my HTML output.
Is this a known bug? Is there a workaround?