Test Start

Valid image-based link

Valid 16x16 pixel image-based link   The image used in this link is 16x16 pixels in size.

8x8 pixel image-based link with additional text.   The image used in this link is only 15x15 pixels in size, but the link contains additional text.

Test End

Rule References

Rule Pass IDs Fail IDs
Rule 42
  • id1
  • id2
  • id3
 none

Calculations

No calculations for test 104

Test Description

  • This test contains three image-based links.
    * The first two links use images that are at least 16×16 pixels in size.
    * The third link uses an image that is only 8×8 pixels in size, but it contains additional text.

Test Markup

User Agent Implementation

No user agent implementation information.

HTML Source Code


<div class="wrapper">
<p>
<a href="#"><img id="id1" src="http://www.oaa-acessibility.org/media/testsuite/images/functional_image.png" alt="Valid image-based" /> link</a>
</p>
<p>
<a href="#"><img id="id2" src="http://www.oaa-acessibility.org/media/testsuite/images/16x16.png" alt="Valid 16x16 pixel image-based link" /></a>
&nbsp; The image used in this link is 16x16 pixels in size.
</p>
<p>
<a href="#"><img id="id3" src="http://www.oaa-acessibility.org/media/testsuite/images/8x8.png" alt="8x8 pixel image-based" /> link with additional text.</a>
&nbsp; The image used in this link is only 15x15 pixels in size, but the link contains additional text.
</p>
</div>

CSS Code


div.wrapper {
  margin: 20px;
  padding: 10px;
  overflow: visible;
  background-color: #faf7f0;
  border: 1px solid #880000;
  -webkit-border-radius: 10px; /* Safari and Chrome rounded corners */
  -moz-border-radius: 10px; /* Firefox rounded corners */
  border-radius: 10px; /* Opera rounded corners */
}