CSSだけでサイドメニューの固定 - 「position: sticky;」が効かない場合
メインコンテンツに比べてサイドメニューが短い場合、スクロールし続けるとサイドメニューの下が空白になってなんとなく落ち着かない。かといってむりやり要素を追加したくはない。JavaScriptを使って固定する方法もあるけれど、めんどくさい。 と思っていたら、CSSだけで固定できるようになっていた。「position: sticky;」と固定する場所を指定するだけなのでとても簡単。 と思ったけれど、すんなり動かない。調べると親要素に「overflow」を指定しているとダメらしい。でも使っていない。 あーだこーだいじくりまわしけれど、固定させたい要素に「height: 100%;」を指定するとすんなり固定できた。 以下当サイトを元にした簡素なコード。 HTML CSS Safariのデベロッパーツールで確認すると、「.side」が「.main」より短くても高さを指定しないと「.main」と同じ高さ
PHP で IE 6 の後方互換対策 - Heartfield
PHPでIE 6の後方互換対策 IEネタが続きますが、あまりに感動したので寝ずに書きます。IE6はCSSを自分勝手に解釈しますが、XHTMLもちゃんと読めません。例えば当サイトはXHTML1.1に準拠して構築してますが、お約束としてHTMLファイルの冒頭に <?xml version="1.0" encoding="UTF-8"?> と記述する必要があります。ところが、IE6はこれがあると、なんかよくわからないんですけど「後方互換モード」でそのページを読み込みます。するとまあいろんな不具合が出てきて調整事がたくさんできるわけです。ならばXML宣言を書かなければいいとなりそうですが、そうすると他のブラウザで不具合が出かねません。ましてこっちは正しいことをいているのだ！ と憤っても問題は解決しないので、またまた「@Style」さんの記事「IE6に困ったら」を参考にさせていただきました。おっと、
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
