Time Taken:

The stylesheet associated with this page is:

      input, textarea {
        border: solid;
        border-width: 1px;
        width: 100%;
      input:hover, textarea:hover {
        background-color: rgb(149, 155, 179);
      table {
        margin-right: auto;
        margin-left: auto;
        width: 75%;
      td, th {
        background-color: rgb(202, 205, 217);

There are what I believe to be the following errors in how this form is rendered in mozilla 0.99.

  1. The :hover pseudo elements for input and text area only triggered when the cursor is on the border and not when it is over the actual element
  2. The :hover pseudo element is triggered when text is typed into an input regardless of the position of the cursor. By the definition it seems as though the :focus element should be triggered, but not :hover
  3. The browse button of the file input has an extra ~15% on the bottom. The text is not vertically centered in the text box or on the button
  4. The reset button does not affect the file input
  5. The file input element seems to be responding to the width: 100% (as evidinced by the trigger of the :hover), but the text area and button are not resized

Additionally some sort of mechanism for styling the elements in the form input would be very useful to developers using stylesheets to alter form appearances. In the css3 spec it alludes to this issue being one of document architecture, but whatever the case some way to make that file dialogue match the appearance of the other elements would be nice.