この日記はMozillaのプロダクトへの貢献者としての私の成果を中心に、気になったバグやWeb界隈の話題について書いていますが、 断り書きがある場合を除き、いかなる団体のオフィシャルな見解ではありません。あくまでも個人的なものです。 Mozilla Foundation、Mozilla Corporation、及び関連企業の公式情報ではないことに注意してください。

現在、XHTML 1.0 (もどき)から、HTML5なコンテンツに修正中です。古い日記は修正が完了していませんので表示が崩れます。 順次、修正していく予定ですのでしばらくお待ちください。

もずはっく日記(2012年10月)

2012年10月20日

Bug-org 795785 editor isn't scrolled to the caret position if editor specified overflow: hidden;
初回投稿日時: 2012年10月20日11時39分48秒
カテゴリ: CSS Firefox Google Chrome IE modest Mozilla Core Mozilla18 Opera Safari バグ修正
SNS: (list)

twitter.comの、ツイートを書き込む<textarea>に、overflow: hidden;が指定されているため、CSS仕様を忠実に守っているFirefoxでのみ、キャレットを移動してもスクロールできず、入力した内容が確認できないことがある、というバグです。

modestに記事を書きましたが、CSS仕様では、overflow: hidden;の要素では、スクロールできるユーザインターフェースを提供してはならない、となっています。勘違いしてる人を時々見かけますが、ユーザインターフェースというのは、GUIのことだけではなく、操作全般を指します。キー入力や、マウスホイール、スワイプ等でもスクロールできてはいけません。

実際、他のブラウザでも、中身が編集可能ではない要素で、overflow: hidden;を指定していると、一切、スクロールできませんが、何故か、<textarea>の場合や、contenteditableな場合にはキャレットの移動によって、スクロール可能でした。

今回の修正で、エディタの内容が変更された場合と、キャレットが移動した場合に、編集可能な要素だと、スクロールが行えるように修正しています。編集不能な要素では引き続き、ユーザによるスクロールは不可能です。

関連するかもしれないエントリ

bug-org 795785を含むエントリ

このエントリへのリンク元

このエントリを参照しているURIはありません。