Getting a "short" barcode using only CSS `height`; disabling the inline `transform: translate(0,0)`

[mehov]

Hi everyone,

Thank you for a great lib!

I want to have a "short" barcode as shown here: https://github.com/lindell/JsBarcode/wiki/Options#height

The above example accomplishes this using the height option, but I need to style it using CSS only. When I set the height CSS property for my barcode svg element, the barcode shrinks its width proportionally, and as a result I'm getting an overall smaller barcode, while I need a barcode that's still wide.

Please see my final svg element below. It somehow gets the width and height hardcoded into it in px.

<svg width="290px" height="104px" x="0px" y="0px" viewBox="0 0 290 104" xmlns="http://www.w3.org/2000/svg" version="1.1" style="transform: translate(0,0)">(…)</svg>

My full CSS code for that svg is:

.label svg {
    height: 30mm;
    transform: rotate(270deg) !important; /*have to override the inline transform*/
    transform-origin: 100% 0;
    margin-left: -150mm;
    width: 150mm;
}

(As a side note, curious if there is a way to turn off the inline transform: translate(0,0) so that I can stop using !important in my CSS file.)