書籍『HTML5&CSS3デザインレシピ集』の内容に誤りがありました。ここに訂正してお詫び申し上げます。
なお、出版社技術評論社のサイトにも正誤情報が公開されています。基本的に同じものが掲載されていますが、更新のタイミングによって一時的に内容が異なる場合があります。そちらも併せてご参照ください。

更新履歴

• 2020/11/25 第4刷 p.118 ── 要素／プロパティのCSSプロパティの訂正を追加
• 2020/11/25 第4刷 p.348 ── テキスト右段5行目の訂正を追加
• 2020/11/25 第4刷 p.569 ── サンプル275のCSSの訂正を追加
• 2020/5/30 第4刷 p.505-p.506の訂正を追加
• 2020/5/8 第4刷 p.244の訂正を追加
• 2019/10/18 第3刷 p.493の訂正を追加
• 2017/5/23 第1刷 p.146の訂正を追加
• 2017/4/6 第1刷 正誤表を公開

第4刷（未修正、2020/11/25現在）

p.118 ── 要素／プロパティのCSSプロパティ

誤）
font-weight: normal;
正）
font-style: normal;

p.244 上から2番目の書式

誤）
・書式 background-repeatプロパティ
正）
・書式 background-attachmentプロパティ

p.348 ── テキスト右段5行目

誤）
CSSを適用する方法については「184」で…
正）
CSSを適用する方法については「183」で…

p.505-p.506 ── Step2, Step3, Step4, Step5の図

誤）
図中の「maincol」
正）
「maincol-container」

p.569 ── サンプル275のCSS

誤）

/* メインコンテンツレイアウト部分 */
...
@media screen and (min-width: 768px) {
  ...
  .sidebar {
    float: left;
    margin: 0 20px 0 20px;
    width: 300px;
  }
  ...
}

正）

/* メインコンテンツレイアウト部分 */
...
@media screen and (min-width: 768px) {
  ...
  .sidebar {
    position: relative;
    float: left;
    margin: 0 20px 0 20px;
    width: 300px;
  }
  ...
}

第3刷

第4刷で修正済みです。

p.493 要素 / プロパティ ─ CSSプロパティ

誤）
text-indent; 空けたい大きさ;
── 段落の1行目の始まりをずらす » 057
正）
font-size: フォントサイズ
── フォントサイズを指定する » 046

第1刷

第2刷で修正済みです。

p.42 詳細度

誤）maginプロパティの値は「0」になります。
正）marginプロパティの値は「0」になります。

p.76 HTML

誤）

厳選された…絶妙ばほろ苦さの…

正）

厳選された…絶妙なほろ苦さの…

p.104 おもなカラーキーワード 表

誤）yellow #000000
正）yellow #FFFF00

p.146 箇条書きのマークを変更したい

このサンプルでは、list-style-typeプロパティ（list-styleショートハンド含む）に文字列を指定する例を紹介していますが、文字列を指定して正しく動作するのは、2017/5/22現在、Firefox 39.0以降のみであることがわかりました。各ブラウザの対応状況については次のページもご覧ください。

list-style-type – CSS | MDN

p.148 CSS

誤）list-style-type: decimal-leading-zero;
正）list-style: decimal-leading-zero;

p.178 もとの画像データがGIFファイルの場合

誤）<img src=”data:image/png;base64,データ”>
正）<img src=”data:image/gif;base64,データ”>

p.263 CSS

誤）background-image: url(../images/bg.jpg) center bottom no-repeat;
正）background: url(../images/bg.jpg) center bottom no-repeat;

p.463 HTML

誤）
<div class=”box”><img src=”images/photo1.jpg” width=”100%” alt=””></div>
<div class=”box”><img src=”images/photo2.jpg” width=”100%” alt=””></div>
<div class=”box”><img src=”images/photo3.jpg” width=”100%” alt=””></div>
<div class=”box”><img src=”images/photo4.jpg” width=”100%” alt=””></div>
<div class=”box”><img src=”images/photo5.jpg” width=”100%” alt=””></div>
正）
<div class=”box”><img src=”images/photo1.jpg” alt=””></div>
<div class=”box”><img src=”images/photo2.jpg” alt=””></div>
<div class=”box”><img src=”images/photo3.jpg” alt=””></div>
<div class=”box”><img src=”images/photo4.jpg” alt=””></div>
<div class=”box”><img src=”images/photo5.jpg” alt=””></div>

p.516 本文6行目

誤）フロートを使った2コラムレイアウトは「まずはじめに……
正）フロートを使った3コラムレイアウトは「まずはじめに……