この件について、導入を諦めていた方が少なからずいらっしゃったのではないでしょうか。
ドロワー自体の採用を諦めていたとするならば、何と残念なことかと思います。
何故ならば、”slidebars.css”の中の”html, body”部分をたった2行改めるだけで問題が解決するからです。
ついでに書いておきますが、サイドバーを開いたときにメインカラム部分を暗くするのも
セレクターの”.js-close-any-slidebar”にたった1行属性と値を書くだけで解決できます。
なんだこんな単純なことだったのかと拍子抜けするぐらい編集する部分が少ないのです。
編集方法が知りたい方はメニューの「EXTRA」→「NOTEBOOK」→「MEMO-4」をご覧ください。

これからWebデザインをする場合はfont-familyの指定はより注意が必要です。
どうしてかというと、CSSで普通にフォントを指定してもそれが反映されない場合があるからです。
同じfont-sizeでもフォントによって微妙に大きさが違うため、
ページ全体のレイアウトに影響してくる場合があります。
このことを知っていないと、Chrome以外のブラウザで正常に見えていたとしても
Chromeで見たときにレイアウトが崩れていて愕然とすることになります。
これからはChrome主体でデザインしていかなければならないと言えるかもしれません。
Googleとしては自社のWebフォントを使わせたいのでしょう。
しかしながら、どうしてもWebフォントにはないものを使いたいときは
サーバーにフォントのファイルをアップして、それを読み込ませるという方法があります。
事実、このブログでもその方法を採用しています。
デメリットとしては、読み込みに少し時間がかかること。
それ以外にサイズが微妙に違うのと文字自体の質が少し荒い気がします。
これらの原因は恐らくサイズを圧縮しているからではないかと思われます。
W3Cで策定したものを効かなくするGoogleのやり方はデザイナー泣かせですね。