タグ

ブックマーク / www.koikikukan.com (3)

  • 小粋空間: 標準準拠モードと後方互換モード・DOCTYPE宣言について - IEでドロップシャドウ画像に枠を表示する

    以前エントリーした「CSSで画像に影をつける(ドロップシャドウ)」で、IEで画像枠が表示されない不具合についての対処方法です。 対処することで、スクリーンショットのようにIEでも画像枠が表示されるようになります。*1 元エントリーで記しているとおり、実験サイトではIEで画像枠(= padding プロパティ)がついていたのですが、エントリー時には画像枠がつかない状態になっていました。そのことについてあまり気にしていなかったのですが、先日この件に関するご質問を頂いて調べたところ、原因が判明しました。 おおざっぱな結論から申し上げますと、テンプレート1行目にあるXML宣言 <?xml version="1.0" encoding="utf-8"?> が画像枠の表示に影響しています。当サイトでは1行目にXML宣言を記述しているため、実験サイト(XML宣言なし)と異なる結果になっていました。 表示

  • Firefox4のメニューをFirefox3っぽくする

    Firefox4のメニューをFirefox3っぽくするカスタマイズです。具体的にはメニューバーの表示・ツールバーの配置・ステータスバーの表示などです。 変更前 変更後 参考:Firefox3(画面はFirefox4のものを埋め込んでます) 1.更新ボタン・中止ボタン・ホームボタンを移動する Firefox3では更新ボタン・中止ボタン・ホームボタンが左側に配置されていましたが、Firefox4では、更新ボタン・中止ボタンはアドレスバーの右側、ホームボタンは右側に配置されています。 変更前 変更後 まず、「Firefox」→「オプション」→「ツールバーのカスタマイズ」をクリック。 ツールバーをカスタマイズするダイアログが開きますが、それはおいといて、次のように更新ボタンと中止ボタンが表示されます。 2つのボタンをドラッグして次のように配置します。 右側に配置されているホームボタンも左に移動しま

    Firefox4のメニューをFirefox3っぽくする
  • 小粋空間: CSS の after 擬似要素で回り込みを解除する

    float プロパティで設定したテキスト等の回り込みを、CSS の after 擬似要素を用いて解除する方法を紹介します(通常の解除方法も併せて掲載しています)。 1.「回り込み」とは 例えば、画像の左(または右)にテキストを表示することを「(テキストの)回り込み」と呼びます。 マークアップ <p> <img src="hogehoge.jpg" alt="image" style="float:left" /> 回り込みテキスト~(略)~回り込みテキスト </p> 表示 回り込みテキスト回り込みテキスト回り込みテキスト回り込みテキスト回り込みテキスト回り込みテキスト回り込みテキスト (X)HTMLでこのような表示を行う場合、先に出現する要素(ここでは img 要素)に対して float プロパティを与えます。float プロパティは、指定された要素を左または右に寄せて配置する際に使用しま

    小粋空間: CSS の after 擬似要素で回り込みを解除する
  • 1