新しいCSSの仕様を色々調べてみた第3回HTML5ビギナーズ！（http://atnd.org/events/44530）の「新しいCSSの仕様を色々調べてみた」の資料です。 『CSS3から新たに加わったレイアウト仕様のCSS Flexbox、 Regions、Shapesで一体どんなことができるのか、ご紹介したいとおもいます。』 以下のCSS3の新しい機能の初心者向け資料です。 ・Flexbox ・Regions ・Shapes ・Multi-column Layout ・Grid Layout ・Exclusions
haruka.sugawa - z-indexを有効にしてFlashの上にプルダウンメニューを表示する
今まで知らなかったのですが、Flashなどを貼り付ける際に使うobjectタグやembedタグには通常状態だとz-indexが効かないようです。 そのため、JavaScript+CSSで表示させているプルダウンメニューがFlashの下にもぐりこんでしまいました。プルダウンメニューはユーザビリティ的にあまりよろしくなさそうなので個人的にはあまり使いたくないもののひとつなのですが、今はそれはさておき。 これを解決するにはobject,embedタグを使うときに一手間かける必要があります。 <object classid="@@" codebase="@@" width="@@" height="@@ id="@@" align="@@"› <param name="allowScriptAccess" value="sameDomain" /› <param name="wmode"
li要素の左側マージン調整が うまくいかなかった原因
解決した後に見つけたのですが、少し前にも俺と同じ理由で同じくらいの時間ハマってた人がいたようです。。。 崖っぷちWEBデザイナーブログ | CSS「ul li」IE Firefox ズレ解消メモ ul,li要素のpaddingとmarginを共に0にしているにも関わらず、IEではli要素の左側にマージンが取られてしまう現象に2時間くらい悩まされました。 この問題はlist-style-position: insideが設定されている場合に発生します。 これはバグではなくIEとその他のブラウザでの実装の違いによるものと思われます。list-style-type: noneを指定してもIEではマーカーの分のマージンが確保されます。 以下に例を示します。 <ul style="border: solid 1px #000; margin-left: 0; padding-left: 0; lis
リスト(ul要素)を装飾した際の表示差を解消 [ホームページ作成] All About
リスト（ul要素）の装飾結果がブラウザによって異なる ul要素とli要素で作る「リスト」（箇条書きなど）をスタイルシートで装飾したとき、ブラウザによって表示が大きく異なってしまった経験はありませんか？ 今回は、ブラウザによって「リストの装飾結果」に差が出てしまう点の、原因と対策をご紹介致します。 下図は、まったく装飾していない状態のリストです。左側がHTMLソースで、右側が表示結果です。 この状態なら、ブラウザ間に表示上の差はほとんどありません。 ここで、リスト全体に背景色を加え、左端にバーを表示するデザインを施したいとします。そこで以下のようにスタイルシートを記述すると…… ul { background-color: #eeffee; /* 背景 */ border-left: 5px solid green; /* 左端線 */ } 各ブラウザでは、以下のように見えます。 Inter
![リスト(ul要素)を装飾した際の表示差を解消 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
