- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Thu, 8 Sep 2011 09:52:35 -0700
- To: Charles Pritchard <chuck@jumis.com>
- Cc: www-style list <www-style@w3.org>
On Sat, Sep 3, 2011 at 11:25 AM, Charles Pritchard <chuck@jumis.com> wrote:
> Is there a method in css generated content to retain existing dimensions? As
> I said, I can
> script it, via getClientRects, but pure CSS would be nice.
>
> Internet Explorer 9 has a nice tool that allows developers to turn off image
> loading, to audit alt text usage.
> CSS generated content allows one to replace an image with the alt content,
> but I believe it re-flows
> the element in the process.
>
> In pure CSS, I'd like to hide an image, and display its alt text within the
> original image bounds, much as IE9 enables for developers.
> As I understand it, this would show the alt text, but it would also resize
> the rendering box, if width and height are not explicitly set.
> <img alt="testing" src="img.png" style="content: attr(alt), 'WARNING: Alt
> Missing';" />
>
> Do we have a means to retain dimensions of the element, when using
> css3-content?
No, there isn't. If you use 'content' on an <img>, you are fully
replacing the content.
If there was a pseudoelement that we could apply to replaced content,
you could do the following:
img {
visibility: hidden;
position: relative;
}
img::before {
visibility: visible;
content: attr(alt);
position: absolute;
top:0; right: 0; bottom: 0; left: 0;
}
~TJ
Received on Thursday, 8 September 2011 16:53:30 UTC