Google Chrome の最小フォントサイズは、SVGにも効いてくる

Google Chromeには、最小フォントサイズという設定があり、デフォルトだと10pxになっています。

この設定により、cssのfont-sizeで10px未満を指定しても、10pxに自動調整されることになります。

この設定ですが、当然HTML上に書いたインラインSVGでも効いてきます。

Inkscapeで作ったSVG(名刺くらいのサイズ)をインラインSVGとしてHTMLに埋め込んだ際に、10pxを下回るテキストがあって、レイアウトが崩れてはまりました。。

全体のレイアウトを変えずに、どうにかSVG内のテキストのfont-sizeを10px以上にできないかなぁと悩み中です。

 

なお、最小フォントサイズは、Chromeの「設定」で、一番下の「詳細設定を表示...」のリンクを押下すると、「ウェブコンテンツ」といった項目が出てくるので、そこの「フォントをカスタマイズ」から変更できます。

f:id:onozaty:20130728004435p:plain

 極小にすることにより6pxにできます。