Product Overview

Build Your Own Web Site The Right Way Using HTML & CSS

Corrections & Typos

Found a mistake that’s not listed here? Contact us to let us know!

Confirmed typos in the January 2008 reprint:

• p.218 code listing
  

  Remove the bottom from:

  background: #bed8f3 url(Images/tagline-fade.jpg) repeat-y
  right bottom;

Confirmed typos in the February 2007 reprint:

• p.272 code listing
  

  The excerpt from style1.css should read:

  form.contact { 
    padding: 0; 
    margin: 0; 
    margin-top: -15px; 
    line-height: 150%; 
  }

• p.274 code listing
  

  The excerpt from style1.css should read:

  form.contact label { 
    font-weight: bold; 
    font-size: small; 
    color: blue; 
  }

Confirmed typos in the December 2006 reprint:

Some of the errors listed here may also apply to previous editions (see below).

• p.87 code listing
  

  The excerpt from style1.css should read:

  p {
    font-size: small;
    color: navy;
  }

• p.88 2nd code listing
  

  The excerpt from style1.css should read:

  h1 {
    font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
    font-size: x-large;
  }

• p.134 screenshot (and all screenshots following)

  Those readers using Internet Explorer (versions 6 or 7) may notice that the space between the top border and the first navigation element in your browser is slightly less compared to what is shown in the screenshot. A similar margin difference occurs above h2 headings on the page.

  This is due to the fact that browsers sometimes apply a default margin to elements—the ul and h2 elements are such elements. It doesn't really affect the layout of your site, but if you'd like your project site to look pixel-perfect in Internet Explorer as well as in other browsers, add the following rule to your style sheet:

  h2, ul {
    margin-top: 15px;
  }

• Chapter 7, pp.288-299
  

  The Response-o-matic site has changed, and as a result the code generated to process a form differs from that listed in the book. However, you can still make use of this service to process your form — in fact there is less code that you'll need to change.

  The primary difference is that the Response-o-matic wizard asks you for an address to direct the user to after the form has been submitted. To use this service, you'll need to create a new page on your site (called thankyou.html that contains a message saying "Thank you for your submission — your details have been emailed to the site owner" or similar.

Confirmed typos in the November 2006 reprint:

Some of the errors listed here may also apply to previous editions (see below).

• p.239 2nd program listing
  The font-weight rule for the table.events caption is missing a value. It should read: font-weight: bold;

Confirmed typos in the September 2006 reprint:

Some of the errors listed here may also apply to the previous edition (see below).

• p.41 2nd program listing
  The doctype is missing the word "PUBLIC". It should read:
  <DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">.
• p.84 program listing
  The following declaration is listed twice in the stylesheet, unnecessarily:

  li {
    font-size: small;
  }

• p.115 first paragraph
  This sentence should read: "Other elements probably appear above or below it, but not on either side (not by default, anyway)."
• p.117 second program listing
  The cite element does not have a cite attribute. The third paragraph tag should therefore look like this:

  <p><cite>Bubble Under</cite> is a group of diving enthusiasts…</p>

• p.118 second program listing
  Again, the cite element does not have a cite attribute. The listing on this page should therefore be:

  <p><strong><em><cite><a
      href="http://www.bubbleunder.com/">Bubble Under</a></cite>
      </em></strong> is a group of diving enthusiasts…</p>

• p.128 third program listing
  The classname should be named .dottedredborder.
• p.129 third program listing
  The classname should be named .dashedgrayborder.
• p.130, 131 program listing
  Strictly speaking, pink is not included as a keyword in the official CSS2 standard, although it is supported by most browsers. However to comply with the W3C standard, the hex value of #ffc0cb should be used instead.
• p.255 first program listing
  The input element is missing an id attribute. It should be:

  <input type="text" name="yourname" id="yourname" value="Bob" />

• p.376 1st para
  The service is called "AddFreeStats", not "AdFreeStats".
• p.381 1st bullet point
  The sentence should read "The next page asks you if you use a web page editor (by which is meant a simple web page builder offered by the likes of AOL, or a program like Dreamweaver or FrontPage)."
• p.383 2nd program listing
  If you add the statistics code as supplied by StatCounter to your pages, they will no longer validate, as the there are three unescaped ampersands in the URL. By replacing the ampersands with &, your pages will validate once again.
• p.387 1st program listing
  The markup as printed in the book does not validate. The div should be nested within the form in order to validate.
• p.391 program listing
  The markup as printed in the book does not validate. The program listing should be as follows:

  <!-- SiteSearch Rollyo -->
  <form id="searchform" name="searchform"
      action="http://www.rollyo.com/search.html" method="get">
    <div id="search">
      <input type="text" name="q" value="" id="search-box" />
      in <select id="searchmenu" name="sid">
        <option value="6170">Bubble Under</option>
        <option value="web">The web</option>
      </select>
      <input type="submit" value="Search" />
    </div>
  </form>
  <!-- SiteSearch Rollyo -->

• p.431 program listing
  The code element should be nested within the pre element, not the other way round.
• p.459 program listing
  The code element should be nested within the pre element, not the other way round.

Confirmed typos in the April 2006 1st edition:

• p.45 second code listing
  The code for the clickable email link contains an erroneous full stop inside the quotation marks. It should instead read:
  <a href="mailto:bob@bubbleunder.com">email bob@bubbleunder.com</a>.
• p.65 second paragraph
  In fact, the cite element doesn’t have a cite attribute. It’s the blockquote element that has a cite attribute.
• p.135 program listing
  The program listing should read:

  #navigation {
    width: 180px;
    border: 1px dotted navy;
    background-color: #7da5a8;
  }

• p.148 code listing
  The line-height should be 125%, not 150%.
• p.156 third bullet point
  This bullet point should be removed; rather than moving the heading down by 3 pixels, it instead receives a top border of 3 pixels on the next page.
• p.282 code listing
  The textarea is missing a name attribute. It should instead read:
  <textarea id="details" name="details" cols="30" rows="7"></textarea>
• p.430 "Attributes" subheading
  cite is not a valid attribute of the cite element. The only valid attributes are the common attributes listed at the start of the appendix.