最終更新日:

device-widthを利用した際のFirefoxの不具合


先日、macOS版のFirefoxブラウザにてメディアクエリに関する不具合を確認しました。その件について調べたこと、わかったことをメモとして残しておきます。 以下、不具合発生時のOSとブラウザのバージョンです。 macO […]


最終更新日:

列幅を固定するtable-layout:fixed


表組みにするTABLE要素は、内包する要素をすべてを読み込んでから描画するため表示が遅くなります。 描画速度を早くするには、スタイルシートの「table-layout:fixed」を使います。この「table-layou […]


最終更新日:

ヘッダ固定でスクロールできるテーブル


HTMLで縦に長い表のときは、見出しを固定(エクセルの「ウィンドウ枠の固定」)して、スクロールできるようにしたい。この動作をCSSだけで実現するようにできたのでメモ。 (2013年8月6日改訂) 動作検証ブラウザ Win […]


最終更新日:

表組の奇数行/偶数行で色分けするCSS3/JS


CSS3では、:nth-child疑似クラスがサポートされました。これを使うと、表組などで奇数行、偶数行それぞれに背景色を付けることなどが簡単にできます。 ただし対応しているブラウザはFireFox3.6, Safari […]


最終更新日:

子セレクタ、隣接セレクタ、属性セレクタの合わせ技


このサイトではヘッダ部をCSSで position:fixed;にしています。 これはヘッダ部をスクロールさせたくないからですが、実際に運用してみると問題が発覚。 内部リンク先を表示した際、リンク先がヘッダに隠れてしまう […]


最終更新日:

IEのFilterの検証


CSS3や透過PNGを未実装のIE用にFilterを使用することがあります。filterはInternetExplorer4から導入された独自機能ですが、調べてみると指定方法が2、3種類あります。 今まであまり深く考えず […]


最終更新日:

a要素を:hoverすると、親要素の高さが小さくなる


作成中のホームページで「ページトップへ戻る」リンクの下に、リンクを追加したところ、IE7、6でアンカーにhoverするとその親要素が伸び縮みするという不具合が起こりました。[サンプルページ1] ソースは以下の通りです。( […]