Start any video training course for FREE. More than 500 to choose from. Learn more
CSS3: The Missing Manual

Errata for CSS3: The Missing Manual

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.

The following errata were submitted by our customers and have not yet been approved or disproved by the author or editor. They solely represent the opinion of the customer.


Color Key: Serious Technical Mistake Minor Technical Mistake Language or formatting error Typo Question Note Update



Version Location Description Submitted By Date Submitted
Safari Books Online chap 7
Colliding Margins section

Example files for figure 7.4 not included in download. Sure would be nice to have more than the tutorial files in the download.

Anonymous  May 09, 2014 
ePub Page Location 6306
First step in Tutorial "Adding Drop Shadows"

Step 1 directs you to: "open the style.css file you completed in in[sic] the tutorial on Enhancing Images (page 272). You'll update the img style you created before" It goes on the step 2 where you add the box shadow, however, at this point I'm clearly only adding it to the external style sheet I was working on in the previous tutorial. When I follow through on the steps and save the file I won't be making any changes to the current html, so when looking at Figure 8-22 I only see the same page. I assumed we adding the external style sheet to the current folder 08->02_gallery_ex. When I did that, the page was definitely not the same as Figure 8-22. So I assumed that the styles.css in this second tutorial does not get updated and only added the drop box property to the initernal style sheet I was working on. Only then was I rewarded with the same web page style as the one in Figure 8-22 I think the step needs to be re-worded or removed altogether to avoid confusion.

Rafael   Jan 06, 2015 
PDF page 44 , 1st paragraph

hi in the page 44, 1st paragraph you mentioned we can download css sample code, I am from IRAN unfortunately and i can't buy the papered book and i am so curious of learning css by this book , can i ask you help me about this sample css code. thanks a million.

sepideh mohseni  Apr 04, 2015 
PDF Page 3
Note at base

'page not found' error for link

Anonymous  Jul 10, 2014 
PDF Page 34
4th paragraph

Adobe Browserlab was shut down in March 2013

Anonymous  Jul 10, 2014 
Printed Page 78
NOTE box

In the note - "first child that is a paragraph tag" - is confusing. Since first child will be the first tag appearing after a parent tag. And this translates to me that format first child which is <p> has to be selected. It should be corrected as "first instance of paragraph tag."

Anonymous  May 07, 2015 
PDF Page 81
chapter 3: selectors: identifying what to style

In book is: You can’t string multiple :not()selectors together. For example, the following is invalid: a[href^="http://"]:not([href*="google.com"]):not([href="yahoo.com]) In other words, you can only use :not( )once with a selector. But (http://www.w3.org/TR/css3-selectors/#negation) says: Example: To represent all h2 children of an XHTML body except the first and last, one could use the following selector: body > h2:nth-of-type(n+2):nth-last-of-type(n+2) In this case, one could also use :not(), although the selector ends up being just as long: body > h2:not(:first-of-type):not(:last-of-type)

Anonymous  Apr 14, 2014 
Printed Page 87
Top: style instructions for ".note"

Line reads "color: #333;" three digits are missing to make this a legitimate HTML color identfier (is the color supposed to be "#333333"?)

Gary Davis  May 26, 2014 
Printed Page 88
First line of "Creating a Descendant Selector"

The book refers to the selectors_basics.html page. Actually it is the selector_basic.html page (no s after selector).

Paul Verger  May 12, 2014 
Printed Page 89
First line

The reference for "descendant selector" is shown as page 88, but that is part of the current discussion and not informative. The actual explanation of descendant selectors is on p. 65-67.

Paul Verger  May 12, 2014 
Printed Page 110
Code after FAQ

It should be this in 3rd edition of this book: change to .byline a { color: red; } p .email { color: blue; } In this case, the link would be blue. Since p .email appears after .byline a in the style sheet, its properties win out.

Josh  Jul 10, 2014 
Printed Page 112
figure 5-4

change #sidebar p.intro—as in the bottom example. to #sidebar .intro—as in the bottom example.

Josh  Jul 10, 2014 
PDF Page 117
n/a

The padding declaration for the ul selector in the CSS reset (folder 5) mentioned in chapter 5 dont have a semicolon (;) at its end. ul { padding-left: 1.4em list-style: square;

Ian  Jan 07, 2015 
Printed Page 117
Step 1

When viewing the Cascade.html file in my default browser (IE 11) I could not see two columns as indicated in step 1. It was obvious that IE was not picking up the external style sheet. As I had used external style sheets many times in the past with no difficulty I compared the <link> statement in the tutorial with mine and the only difference was the absence in the tutorial of the attribute type="text/css". I added this to Cascade.html and the problem was solved. I tried viewing the Cascade.html file, before adding the 'type' attribute, in Firefox, Safari and Chrome without problem. In earlier chapters there are several references to adding type="text/css" if the reader is using HTML4 or XHTML but I assume that all the HTML files in the tutorial folder are in HTML5 therefore this should not be necessary. Perhaps you could consider adding a brief reminder in those tutorials that use external style sheets that this is necessary for those readers using IE 11 or earlier?

Robin Thornton  Feb 06, 2015 
Printed Page 122
Step 3,

First line reads ".intro". It should be "p.intro"

Donald McRoberts  Dec 11, 2014 
Printed Page 122
Step 3.

Oops, jumped the gun on my last input. There is NO error in the text as it is fully explained further down the page... Please delete my last two entries.

Donald McRoberts  Dec 11, 2014 
PDF Page 132
final section on page - 'Using Web Fonts'

"However, you’re limited to fonts your visitors likely to have installed on their computers." The word 'are' is missing, between 'visitors' and 'likely'

Anonymous  Jun 14, 2014 
PDF Page 139
Second bullit

Is now: Line 3 for IE9 Should be: Line 4 for IE?

Anonymous  Apr 13, 2014 
PDF Page 156
2nd paragraph

Red is 0 (it’s also 360, since that’s one full rotation around a circle), yellow is around 50, orange around 100, green around 150, and so on. Each color is separated by around 51 degrees. Actually orange around 50 and yellow around 100.

Rustam Hajiyev  Mar 20, 2015 
PDF Page 189
4rd paragraph

The font-family value is incorret. html { font-size: 62.5%; font-family: Arial, Helvetica, sans-serif; background: rgb(225,238,253) url(images/bg_body.png) repeat-x; } Should be: html { font-family: PTSans, Arial, sans-serif; font-size: 62.5%; background: rgb(225,238,253) url(images/bg_body.png) repeat-x

Ian  Jan 10, 2015 
Printed Page 189
paragraph N° 2

Having completed the tutorial N° 06 my page was different from the finished version. I eventually traced the source of the problem to an error on page 189:- font-family: Arial, Helvetica, sans-serif; should be font-family: PTSans, Arial, sans-serif; Regards, Robin Thornton

Robin Thornton  Feb 05, 2015 
Printed Page 201
United States

It says "you cant increase the height of the inline element with top or bottom padding or margin". This is untrue because I can add top and bottom padding. Margin is the only property that will only let you add left and right.

Joseph  Aug 15, 2014 
PDF Page 211
2nd Paragraph

Second Line of 2nd Paragraph says: "A positive element positions the shadow below the ..." It should be... "A positive value positions the shadow below the ..."

Abdul Quadir  Apr 22, 2014 
PDF Page 230
2nd sentence

Shouldn't this: "Click at the end of the closing brace of the body tag selector," be something like this: "Click at the beginning of the closing brace of the style tag,"

Anonymous  Jun 15, 2014 
Printed Page 248
Browser Bug

"This happens when the content on a page is shorter than the browser window is tall" Should be changed to.... "This happens when the content on a page is shorter than the browser window."

Nixon  Jul 18, 2014 
PDF Page 256
2nd Last Line in Note Box

Second Last line in Note box says... "accepted shorthand properties - image, position, repeat, placement, and color" It should be: "accepted shorthand properties - image, position, repeat, attachment, and color"

Abdul Quadir  Apr 30, 2014 
PDF Page 260
The first "background-image" code

The "background-image" code ends with two semicolons instead of one.

Jurgen  Apr 19, 2014 
PDF Page 260
most examples and description

syntax of gradients was a little changed and now all chapter about gradients have not a right description for example, linear gradient for set position need to use keyword "to" before set a value, for example: linear-gradient(to left....); in radial-gradients the same problem to position starting (center) point of radial-gradient must have keyword "at" before values and now must be after set shape and before color-stop, for example: radial-gradient(circle, at 100px 100px...) so old description and examples now have not working

Oleg  Apr 22, 2014 
PDF Page 262
Code after 2nd Paragraph

The Code after 2nd Paragraph says... background-image: linear-gradient(left, black, rgb(255,255,255), #FFFFFF, HSL(0,0,0%)); It should be... background-image: linear-gradient(left, black, rgb(255,255,255), #FFFFFF, HSL(0,0%,0%)); The percentage sign in the second value of HSL was missing...

Abdul Quadir  May 02, 2014 
Printed Page 326
last line of style in step 7

The "width 175px;" in the last line of the style should be in boldface, to conform with the book's standard. Great book!

Paul Verger  May 20, 2014 
Printed Page 341
1st paragraph

.button:active { -webkit-translate(1px,2px); -moz-translate(1px,2px); -o-translate(1px,2px); -ms-translate(1px,2px); translate(1px,2px); } These should be: .button:active { -webkit-transform: translate(1px,2px); -moz-transform: translate(1px,2px); -o-transform: translate(1px,2px); -ms-transform: translate(1px,2px); transform: translate(1px,2px); }

Karen Schaefer  Dec 14, 2014 
PDF Page 348
Transition Timing 2nd paragraph

The transition-timing-function property can take one of five keywords there are more possible keywords, the missing: steps(), step-start and step-end

Oleg  Apr 24, 2014 
PDF Page 349
Figure 10-8

in Page 349 For example, the Bezier curve pictured in Figure 10-8 starts off steep (the animation begins quickly), then flattens in the middle (the animation slows down), and then grows steep again (the animation rapidly progresses to its final state). To create this kind of animation, add this line of code: transition-timing-function: cubic-bezier(.20, .96, .74, .07); Figure 10-8 In this example, the line starts off relatively flat, meaning the animation will move slowly at first, then ramps up steeply at the end, meaning the animation will quickly progress to the finish at the end of the transition’s duration. should be In this example, the line starts off steep, meaning the animation will begins quickly at first, then ramps up steeply at the end, meaning the animation will quickly progress to the finish at the end of the transition’s duration.

Li Min Yu  May 19, 2014 
PDF Page 383
last paragraph

To highlight a column, you can use the background properties. Again, assume you have a <col> tag with a class of price applied to it: .price { background-color: #F33; } Should be To highlight a column, you can use the background properties. Again, assume you have a <col> tag with a ID of price applied to it: #price { background-color: #F33; }

Li Min Yu  Aug 12, 2014 
Printed Page 389
first paragraph

"float: left;" should be: "display: inline-block".

Anonymous  Nov 10, 2014 
Printed Page 391
Step 4 | code: line 3

"font-size: 1.3em" should be "font-size: .85em" In the completed version of the tutorial (file) the caption font-size has a value of .85em, which is the right value to make it small. With a value of 1.3em the caption gets bigger.

Anonymous  Nov 10, 2014 
Printed Page 395
3rd paragraph

"bringing down the size" should be "bringing up the size"

Anonymous  Nov 10, 2014 
Printed Page 398
Step 9-10

In keeping with previous text conventions in this book, the new properties added to the styles should be bolded.

Anonymous  Nov 10, 2014 
Printed Page 400
Step 15

"add one last style for the pull-down menu and the three text fields" should be: "add one last style for the three text fields"

Anonymous  Nov 10, 2014 
Printed Page 418
Bottom paragraph

The very last sentence on page 418 of the 3rd edition reads: "The HTML for the floated element must appear before the HTML for the element that wraps around it." I believe what the author intended to say was this: "The HTML for the floated element must appear before the HTML for the element it wraps around." TERRIFIC book! Thank you, Mr. McFarland!

Erik Gloor  May 16, 2014 
Printed Page 428
Last paragraph

"The last two styles make IE6 and IE7" shouldn't that be "The last style makes .."

Anonymous  Nov 15, 2014 
Printed Page 428
4th paragraph

"to add the following two properties" shouldn't that be "to add the following property"

Anonymous  Nov 15, 2014 
Printed Page 430
5th paragraph - 5th line

"you give that column a class .." shouldn't that be "you give that <div> tag a class ..."

Anonymous  Nov 15, 2014 
PDF Page 441
first step, last sentence

the text could be made more clear. You should read: You’ll next add the <div> tag for the left sidebar or if you prefer HTML5: add the <aside> tag.

Jurgen  Apr 29, 2014 
PDF Page 441
first paragraph

in Page 441 <!- first sidebar goes here --> Should be <!-- first sidebar goes here -->

Li Min Yu  Jul 24, 2014 
PDF Page 522
last paragraph

in Page 522 You’ve already seen the @media directive in Chapter 14, for creating media queries to target different features and settings of a web browser (such as screen width). should be You’ve already seen the @media directive in Chapter 14, for creating media style to target different features and settings of a web browser (such as screen width).

Li Min Yu  May 19, 2014 
PDF Page 602
last paragraph

inPage 602 960 Grid System (http://960.gs). One of the better CSS frameworks that provides a set of basic styles and a technique for using divs and class namesto create complex, multicolumn, fixed-width layouts. (You can find a detailed video introduction to this system at http://nettuts.com/videos/screencasts/adetailed-look-at-the-960-css-framework/). Can not find the video introduction URL, where is the new URL? thanks.

Li Min Yu  May 19, 2014 
Other Digital Version 5270
In the style code for css

This is kindle version. This error occurs in 7th chapter's tutorial. h1 properties are written in the manner h1{ ...... color:#85A110; ........ background-color:rgb(133,161,16); ..... } here color and background color are same , so i won't see any text in h1 tag. the value in finished tutorial is background-color:rgb(226,235,180), which is not written in the kindle book

Anil M  Jun 12, 2014 
Mobi Page 10384
2nd step

On location 10383 of CSS3: The Missing Manual (Kindle version); there seems to be an error in the description of what to cut from the code and paste. Step 2 says to select <!-- FIRST SIDEBAR goes here --> and all the content down to the closing </article> tag then cut and paste above the FIRST SIDEBAR. You can see where this might be a bit confusing. Especially since you just cut out all of the sidebar information from the code. I think this was meant to say: Select <!-- main content goes here --> and all content down to the closing </article> tag then cut and paste above the first sidebar (since we're arranging the main content above the supplemental content in the first sidebar).

Russell Rogers  Mar 14, 2015