高村さんこんにちは。ご愛読ありがとうございます。

P.118 タグのデフォルトスタイルシート

そのパディングよりも右側に配置
されるので、というフレーズについて、ここでいうボックスは、たとえば
スタイルが適用される領域というようなニュアンスなのでしょうか？

ご質問の趣旨を正確に理解できているかどうか…　回答が的外れだったらもう一度ご質問ください。

ボックスという単語自体は、前著でも、CSSデザインのきほんでもP.97〜99で説明しているとおり、タグがその要素の内容を表示するために確保する領域のことです。

ここでは、ulとliの表示状態の話をしていますが、ここで言っている「ボックス」は、liのボックスのことです。liのボックスは、ulのボックスのコンテンツ領域内に表示されます。ulのデフォルトスタイルシートには左パディングが設定されているため、ulのコンテンツ領域はその左パディングぶん右に寄った状態になっています。liはulのコンテンツ領域内に表示されるので、liに設定したボーダーがulのコンテンツ領域を突破して左まで（つまりulのパディング領域まで）伸びることはない、ということです。テキストだけだと説明が非常にややこしいのですが、これを読んだ後にP.118の図を見ていただくとわかるのではないかと思います。

P.170 <div class=”header”>には何もない？
鋭い質問ですね。そのとおりです。
ここでは、すべての子要素にposition:absoluteが指定されているので、親要素からは子要素の存在が見えなくなっています。
逆に、position:absoluteが指定されていない子要素があれば、親要素は、その子要素が収まるぶんの高さを確保します。

　狩野さま

　回答ありがとうございます。

　＞タグがその要素の内容を表示するために確保する領域のこと

　インライン要素に分類されるタグに、marginを設定しても、
leftとrightは確保できても、TopとBottomが確保されないのは
なぜだろうといったような、ボックスの概念とタグが確保する
領域とはどのような関係にあるのだろうと思い質問させていた
だいておりました。

　なんとなく、タグごとに確保される領域がちがうのかなとか
P118の解説を読みながら考えあぐねていましたが、ulタグの
なかに、liタグがボックスを確保しているとのこと、解説の
内容がとてもよくわかりました。

　また、p170の解説も、すっきりしました。ありがとうござい
ます。

　ただ、今回の件、いろいろ調べていると、HTML5では、そもそも
ブロック要素・インライン要素という要素の分類はされなくなった
という説明をいくつかみつけました。なくなったという説明も。

　Webの情報なので、そもそも正しい情報なのかよくわかりません
でしたが、スラスラわかるCSSデザインのきほんは、HTML5準拠と
あったので、この点、どのようにとらえたらいいのか、もし、お伺い
できましたら幸いです。

　それから、最後に、今回、著書で勉強させていただいて、だいぶ
HTMLが読めるようになり、CSSもいろいろ試行錯誤できるように
なりましたが、そうなると、疑問が出た際に、正確に理解したいと
思うものの、HTML5やCSS3の仕様を確認するのも、まだ、なかなか
大変で、いろいろと苦戦しています。

　きほんシリーズの次があると、とても嬉しいと思いました。

　なにか、そういったものを今後予定されているということが
あれば、教えていただけましたらとても嬉しく思います。

　ありがとうございました。

高村さん

HTML5では、そもそもブロック要素・インライン要素という要素の分類はされなくなった

（今回の話はちょっと難しく、また実際にHTMLを書く上で必要な知識でもないので、混乱しそうなら読むのを途中で止めてくださいね）
事実です。HTML5では、それまで使われてきたブロック／インライン要素の代わりにコンテントモデル／カテゴリーという概念が導入されました。ただ…

long story short
実用上は「ブロック／インライン要素」という分け方で問題はありません。

long story
HTML5では、タグをブロック／インライン要素で分類することはなくなりました。この、ブロック／インライン要素というのは、本来、HTMLは文書構造を作るもので、見た目やレイアウトのことは定義しないことになっているはずなのに、
「なんで見た目がブロックで表示されるのか、インラインで表示されるのかで分類されているの？おかしくない？」
ということ、それからタグのデフォルトがブロック／インライン要素どちらであっても、displayプロパティ（スラスラCSS P.181）を使えば違うボックスで表示できることから、仕様が矛盾しているという問題がありました。

そこで、HTML5では、コンテントモデル／カテゴリーという新しい概念を導入し、タグの役割に応じて分類することにしました。
知らなくてもよいことをあまり長く説明しませんが、簡単にいっておくと、コンテントモデルは、そのタグが子要素にできる要素を定義していて、カテゴリーは、タグの役割に応じた分類です。

ここで誤解しないでほしいのは、CSSのブロックレベルボックスや、インラインレベルボックスがなくなったわけではないということです。

たとえばdivはブロック要素とは呼ばれなくなりましたが、ブロックレベルボックスで表示されます。strongはインライン要素とは呼ばれなくなりましたが、インラインレベルボックスで表示されます。

実用上はブロック／インラインと考えて問題ない
このコンテントモデル／カテゴリーという考え方自体はうまくできていますが、ほとんど言葉遊びの領域であり、「仕様を定義するための仕様」化しているとしかわたしには思えません。とくに、HTML5が勧告になり、ある機能（アウトライン機能）の扱いがほぼ無効化されたので、コンテントモデル／カテゴリーはたいした意味をなさなくなっています。

しかも、コンテントモデル／カテゴリーには、インライン要素に分類されていた、strong、span、inputなどを指す「フレージングコンテンツ」というカテゴリーはありますが、ブロック要素に分類されていた、div、p、ulなど、コンテンツをグループ化するような要素を指すカテゴリーがありません。
そのため、100%HTML5の仕様にのっとって、タグやCSSの仕組みをわかりやすく説明することはほぼ不可能だとわたしは考えています。そんなことから、また直感的なわかりやすさ、実用上の観点から、わたしはブロック／インライン、の区分を使っています。

最後に

今回、著書で勉強させていただいて、だいぶHTMLが読めるようになり、CSSもいろいろ試行錯誤できるようになりましたが、そうなると、疑問が出た際に、正確に理解したいと思うものの、HTML5やCSS3の仕様を確認するのも、まだ、なかなか大変で、いろいろと苦戦しています。

お役に立てて光栄です。
私見ですが、実際にHTML/CSSを書く上では、本来の仕様を詳しく知る必要はないと思います。

ただ、仕様そのものを理解したいときもあるでしょう。
そういうとき、わたしは、最初は疑問や必要なところだけちょっと読んでみて、わからなければ深追いせずに退散して再度挑戦するというのを繰り返しました。そうするうちに、なにが書かれているかわかるようになってきました。

　狩野さま

　回答ありがとうございます。

　今回解説していただいたお話を調べていく過程でいろいろと勉強になりました。

　いただいた説明からすくなくとも、HTMLの目指す方向性（セマンティックWeb）、
置かれている環境（従来の方法との関係）、また、その存在の形（コンテンツモデル）
について、おおまかにイメージ（スタンス）をとることができたように思います。

　divというものの位置づけ、推奨されるレイアウト方式の変化等、とまどう部分も
ありましたが、柔軟に対応できそうです。

　お話のなかにあった「アウトライン機能の無効化」のお話、仕様の中に確認する
ことができませんでしたが、確認ツール（HTML5 Outliner　etc)のようなものが
より実行化されるような機能が実現される予定だったのでしょうか。おいおい勉強
していければとおもいましす。

　今回は、大変勉強になりました。

　マークアップとは直接関係のないお話もまた、大変勉強になります。

　読者として、機会がありましたら、そういったお話も、わかりやすくお伝え
いただけたらとてもありがたく思います。

　ありがとうございました。