No generated content for img tag

RESOLVED DUPLICATE of bug 245633

Status

()

RESOLVED DUPLICATE of bug 245633
9 years ago
9 years ago

People

(Reporter: rickywalt1, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

9 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.9.1.5) Gecko/20091102 Firefox/3.5.5
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.9.1.5) Gecko/20091102 Firefox/3.5.5

I was reading Rob Glazebrook's article on CSSNewbie on a javascript solution to providing captions for images. I knew I'd seen a pure CSS 2.1 solution. It just took a bit to find it.

Use the :before and/or :after pseudo elements and the content: property to generate a caption from the title attribute. While this works for many, if not all, HTML elements, it doesn't work on img. It doesn't work in Firefox 3.5 or 3.6b4, although it does work in Opera 10. I don't have a copy of Safari to test.

This is probably an already know issue, but I couldn't find any bug report.

Reproducible: Always

Steps to Reproduce:
1. Create simple (x)html test case.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>
      Generated Content for img tag
    </title>
<style type="text/css">
img:after { content: "This is an " attr(title); display: block; } 
</style>
  </head>
  <body>
    <div>
      <p title="this is a test ">
        <img src="images/earth2.png" alt="Earth picture" title="Earth Picture" border="0">
      </p>
    </div>
  </body>
</html>
2. Display in browser
Actual Results:  
No generated content

Expected Results:  
The words 'This is a Earth Picture' below the image
:before and :after aren't supposed to work on replaced elements.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 9 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 245633
You need to log in before you can comment on or make changes to this bug.