title: Override !important on width attribute?
body: <p>I have some external css styles, and one of them adds this rule: </p>
  
  <pre><code>svg {
      width: 100% !important
  }
  </code></pre>
  
  <p>This seems to override my <code>width</code> attribute (when inspecting in chrome DevTools). The thing is that it overrides the width from a div element that's generated by a javascript plugin (Leaflet) which expands a given div to have this a an element (a svg element with a 3 lines in it).</p>
  
  <pre><code>&lt;svg class="leaflet-zoom-animated" width="1442" height="728" viewBox="-722 -364 1442 728" style="transform: translate3d(-722px, -364px, 0px);"&gt;
      &lt;g&gt;
          &lt;path stroke-linejoin="round" stroke-linecap="round" pointer-events="none" stroke="green" stroke-opacity="1" stroke-width="5" fill="none" d="M-584 -109L-252 64"&gt;&lt;/path&gt;
      &lt;/g&gt;
      &lt;g&gt;
          &lt;path stroke-linejoin="round" stroke-linecap="round" pointer-events="none" stroke="green" stroke-opacity="1" stroke-width="5" fill="none" d="M-222 167L-252 64"&gt;&lt;/path&gt;
      &lt;/g&gt;
      &lt;g&gt;
          &lt;path stroke-linejoin="round" stroke-linecap="round" pointer-events="none" stroke="green" stroke-opacity="1" stroke-width="5" fill="none" d="M34 -338L-252 64"&gt;&lt;/path&gt;
      &lt;/g&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>The width is needed to display the Leaflet map, and currently it seems to collapse to 0px by 0px (the parent node has no size either, which is fine though). </p>
  
  <p>Is there any way I can make sure the element still gets the width that is set by the Leaflet plugin, and that it's not being overriden? </p>