Misconception: Students may have trouble identifying errors in their code that cause elements to disappear from the page.

  • Common sources of this error include missing content, height, border, or background. When one or many of these elements is missing, it may cause an element to rendered invisible.
    • For example, the HTML element below will be invisible on a page because there is no content in it:
      • <div style="width:500px;"></div>
  • This type of error is called a rules-based error. It occurs when the student is familiar with the basic rules and constructs of a language, but comes up against an unknown exception, edge case, rule, etc.
    • This may be the result of incorrect research or assumptions about what is valid, or it can simply be the result of not knowing all the rules, exceptions and edge cases for programming with HTML and CSS.

More about this tip

External Source
"Towards a Taxonomy of Errors in HTML and CSS" by Thomas Park, Ankur Saxena, Swathi Jagannath, Susan Wiedenbeck, and Andrea Forte.