Errata

Head First HTML and CSS

Errata for Head First HTML and CSS

Submit your own errata for this product.

The errata list is a list of errors and their corrections that were found after the product was released. If the error was corrected in a later version or reprint the date of the correction will be displayed in the column titled "Date Corrected".

The following errata were submitted by our customers and approved as valid errors by the author or editor.

Color key: Serious technical mistake Minor technical mistake Language or formatting error Typo Question Note Update

Version Location Description Submitted By Date submitted Date corrected
Appendix A. Leftovers
Combining selectors -

Appendix A. Leftovers: The Top Ten Topics (We Didn’t Cover)
#1 More CSS selectors
COMBINING SELECTORS
1: Start by defining the context for the element you want to select, like this:

At number 1 of combining selectors you say :

"here we are using a descendant selector" . the image shows :

div#greentea > blockquote

I think this is a "child selector"

Note from the Author or Editor:
Thank you! Yes, this should be “child selector”.

Sergio M F Valeriano  Jan 26, 2021  Dec 10, 2021
Printed
Page 326
Step 4: add the @font-face property to your CSS

The url that is used to load the font uses the wickedlysmart.com website. I couldn't get this to work at first and it turns out that my browser (Firefox, also happens on chromium) prevents the font loading as it thinks this is a cross-site scripting violation.

I fixed this by creating a folder on my server (called fonts) and downloading the fonts to there, then changing the URL to refer to the server folder.

There maybe a way to switch off the cross site scripting error for this specific site in the browser but I am unaware how to do this.

Note from the Author or Editor:
There isn't a way - the solution is to download the font files and change the URLs to point to the local files.

Douglas Cooper  May 15, 2020  May 29, 2020
Printed
Page 591
4th line of <video...> element.

As printed:
<source src="video/tweetsip.ogv"

should be:
<source src="video/tweetsip.ogg"

Note from the Author or Editor:
Yes the file should be tweetsip.ogg.

 Chris Scantlin  Feb 27, 2020  May 29, 2020
Printed
Page 269
Middle of page - <img src

In the html examples/exercises in chapter 7 (pages 261, 262, 269, 275) you have added a <p> before the <img src ... and then a closing </p> but in all past examples, the <img src ...> isn't between a <p> and a </p>.

In earlier exercises and examples in chapter 6, page 229, 234, 235, 236, 237, 240, 243,248, 251, and 253, the <img src> is NOT between a <p> and a </p> and I can't find any content that tells us to change to doing so (unless I missed it and I looked back and forth to see).

Which is correct? And at what point did you tell us to start putting the paragraphs tags around the image source? Thank you!

Note from the Author or Editor:
Hi thanks for letting us know about the inconsistency in how we add images! It's not actually a huge deal. If you keep reading you'll see that images are inline elements, while p is a block elements. So by placing an image inside a p element, you are making sure the image will be in a block separate from any text that the image would otherwise flow in with.

Yes, we probably did forget to tell you to put the img in a p, so sorry about that! If you review the chapter on inline and block elements you'll hopefully see how it works, and we'll get this oversight fixed in the next edition.

Thank you!

 Chris E Rea  Mar 15, 2019 
Printed
Page copyright

Add credit to copyright page:
Brain image on spine: Eric Freeman

 O'Reilly Media
 		 Apr 10, 2018  Jan 10, 2020
Printed
Page 410
media query for portrait oriented tablet

If the orientation is portrait, wouldn't the max-device-width be 768px?

Note from the Author or Editor:
page 410: 2nd link in solution, for lounge-tablet-portrait.css, change max-device-width:1024px to max-device-width: 768px

 Andrew  Jul 29, 2015  Jan 29, 2016
PDF
Page 10
left column, 5th paragraph

His daughter is a frequent vistor to Eric’s studio

there VISTOR, must be VISITOR.

 Oleg  Nov 13, 2014  Jan 29, 2016
PDF
Page 245
4th paragraph

The doctype is misspelled:
Use <!docytype html> at all times, unless
you really are writing HTML 4.01 or XHTML.

 Isabelle  Sep 14, 2014  Oct 03, 2014
Printed
Page 223
middle left side

"...and a whole new set of capabilties aimed at"
"capabilties" should here be "capabilities"

Note from the Author or Editor:
Fixed.

 Anonymous  Jul 08, 2014  Oct 03, 2014
Printed
Page 167
PNG section

"PNG compresses the file to reduce its size, but doesn't throw anything way"
"way" should here be "away"

Note from the Author or Editor:
Fixed

 Anonymous  Jul 08, 2014  Oct 03, 2014
Printed, PDF
Page 476
United States

If the figure on the right is correct (which I believe it is), then the figure on the left should mimic it as regards the non-text elements. Namely, the second and fourth paragraphs (fifth and seventh blocks) are missing elements. The second paragraph should include the final "em span em" and the fourth paragraph should include four img elements. (Compare with pp. 479-480.)

Note from the Author or Editor:
Great catch! The missing pieces were there, but they were hidden. I think this got messed up when we transferred the files from ID CS4 to CS5.5. Ugh! I hope nothing else like this got messed up.

Anyway it's fixed now on this page.

 Richard Levine  Jan 12, 2014  Oct 03, 2014
Printed, PDF
Page 48
3 instances: middle of page, bottom of page, last paragraph with arrow

There are three instances of the text "driving directions" that should be replaced with "detailed directions" (as in the previous and next pages).

Note from the Author or Editor:
Fixed

 Richard Levine  Dec 30, 2013  Oct 03, 2014
Printed
Page 329
bottom box

In the printed version, the box at the bottom of page 329 is empty. It should contain the rest of the content from the bottom box on 328. It's there in the pdf, but not in the printed version.

Note from the Author or Editor:
This is bizarre. I see the content in the ID file, but do not see it in my version of the PDF. It's also definitely missing in my printed book!! Needs a look by a production editor.

---------
legitimate error; was fixed in 12/2/2013 reprint --PROD

 Matt Fielder  Dec 16, 2013  Dec 02, 2013
PDF
Page 329
bottom page - invalid image

invalid picture at the bottom - there is end of the % from 328
I have the first edition, and there is image, but in second its gone

Oleg  Dec 02, 2013  Dec 02, 2013
PDF
Page 455
infobubble poinitng to part of :hover pseudoclass

...This makes the link loo highlighted...
it should say look instead of loo

Note from the Author or Editor:
Should say "look"

 nenad  Aug 02, 2013  Dec 02, 2013
Printed
Page 448
The paragraph right under Steps one and two: Adding the <span>s

Open your "lounge.html" file and locate the"Who's playing a the Lounge" heading.

It should be "What's playing at the Lounge". "What" is in the lounge.htm file and printed throughout the book.

Note from the Author or Editor:
confirmed. Change "Who's" to "What's"

John I. Adams  Jan 04, 2013  Jun 21, 2013
Printed
Page 633
The answer to the 3rd question

Chapter 13, the last "there are no Dumb Questions"
The second question refers to the "list-style-position" property. The third question continues the explanation, but incorrectly refers to the property as "line-style-position"

Note from the Author or Editor:
confirmed. Change "line-style-position" in third NDQ to "list-style-position".

 Donald Rind  Dec 06, 2012  Jun 21, 2013
Printed
Page 635
3 Down description

Chapter 13 HTMLcross, 3 Down description has a CSS property named "list-item-position"; as far as I can tell, there is no property with that name, certainly not in the chapter. It probably should read "list-style-position".

Note from the Author or Editor:
confirmed: change "list-item-position" to "list-style-position" in 3 down clue. (no change necessary to x-word solution)

 Donald Rind  Dec 06, 2012  Jun 21, 2013
PDF
Page 112
Last paragraph

You state the wrong character entity for the copyright symbol in the parenthesis in this sentence: "So what about the copyright symbol (that?s &copyright;)?"

The correct character entity is "?".

Note from the Author or Editor:
Should be &copy;

 Tormod Hystad  Oct 14, 2012  Nov 02, 2012
PDF
Page 116
Crossword on P.116 does not match the proper solution on 121

Wrong HTMLcross puzzle image on page 116.

Note from the Author or Editor:
Yup! We'll need to look at the crossword files and see if the puzzle is wrong or the solution and make sure we get them matched up.

 ebrownco  Sep 01, 2012  Nov 02, 2012