CSSでSVGの幅をどのように拡大できますか？

Question

私はGoogle's Charts jsライブラリを使用しています。それは素晴らしい作品、私たちのデータのための素晴らしいグラフを作成します。

残念ながら、作成方法によって応答しないため、画面サイズが変更されても一致するようにはなりません。私はファンクションを介して解決されたものをwindow.onresizeに設定したので、これは修正されています。

印刷はサイズ変更イベントと見なされないため、再描画は呼び出されないようです。私は、印刷時にページの残りの部分を大きく見えるように印刷専用のCSSを作成していますが、グラフのサイズはブラウザのウィンドウと同じです。私はウィンドウを小さくすることができ、ページスケーリングをねじ込むことなく印刷しますが、それは実際の解決策ではありません。

私が試してみました：

はprint.cssないようにsvg{width:100%;}を追加する - 私が試したことのないダメ

：

がきれいに印刷されるグラフセットのサイズを作るの - このハックのように思えますが、可能ならばそれをしない方がいいです。

EDIT

ワン変更：GoogleのチャートAPIは<div>で<svg>としてSVGを作成します。背景画像ではありません。

Answer 1

これは紹介です：

https://developer.mozilla.org/en-US/docs/Web/CSS/Scaling_of_SVG_backgrounds

と私の解決策：いくつかの試行錯誤の後

、これは私が見つけたものです。 （オリジナルのCSSに）追加

：

html { 
    height: 100% 
} 

は、私は、元の仕様で探していたまさにお届け。

私はそれがトリミングされたときの画像が中央になりたい場合はまた、私が使用することができます

html { 
    background: url(path/to/image.jpg) no-repeat center center fixed; 
    background-size: cover; 
} 

最後に、私はそれが中心になりたい場合は、常に縦横比を維持するが、トリミングすることはありません（すなわち、いくつかの空白はOKです）、私は何ができる：

body { 
    background: url(/path/to/image.svg) no-repeat center center fixed; 
    background-size: contain; 
}