サポートブログ - 『現場のプロから学ぶXHTML+CSS』サポートサイト

9章「トラブルシューティング」サンプルファイル（2）

Firefoxでテーブルの左ボーダーが表示されない

2008年11月 4日 | パーマリンク
カテゴリ：

9章「トラブルシューティング」サンプルファイル（1）

フロートしたはずの要素が横並びにならない（IE 6）

解決前

ボックス間の上下マージンが指定どおりに表示されない

作例なし

heightプロパティで「100%」が適用されない

サイズ指定したボックスが勝手に広がってしまう（IE 6）

解決前

ブラウザごとにz-indexプロパティの挙動が異なる

文字がつぶれたように表示される

フォントサイズを変更したら画像がズレる（IE 6）

リストマーカーが表示されない

リストマーカーが表示されない（IE 7）

フォームパーツの不揃い感を解消したい

2008年11月 4日 | パーマリンク
カテゴリ：

『現場のプロから学ぶXHTML+CSS』正誤表

『現場のプロから学ぶXHTML+CSS』の誤植などはこちらのエントリーでアップデートします。

もし、お気づきの箇所がありましたら、コメントいただけると助かります。

p.66

表内「ボーダー」

border-bottom. border-left 　↓　↓　↓ border-bottom, border-left

「.」でなく、「,」が正しいです。

2008年11月 3日 | パーマリンク
カテゴリ：補足

8章：タブパネル

--

p.273のタブパネルのサンプルコードですが、先日リリースされたjQuery1.3で動作しないので対応バージョンを公開いたします。

:not(:first)の記述で動作しなくなったので:not(:first-child)に変更しております。変更後のソースコードはjQuery1.2.6、jQuery1.3共に動作するソースです。

変更前

$(function(){
    $(".tab li:first-child").addClass("selected");
    $(".panel li:not(:first)").css("display","none");
    $(".tab li").click(function(){
        $(".tab li").removeClass("selected");
        $(this).addClass("selected");
        $(".panel li").css("display","none");
        $(".panel li:eq("+$(".tab li").index(this)+")").css("display","block");
    });
});

変更後

$(function(){
    $(".tab li:first-child").addClass("selected");
    $(".panel li:not(:first-child)").css("display","none");
    $(".tab li").click(function(){
        $(".tab li").removeClass("selected");
        $(this).addClass("selected");
        $(".panel li").css("display","none");
        $(".panel li:eq("+$(".tab li").index(this)+")").css("display","block");
    });
});