- From: Alex Meiburg <timeroot.alex@gmail.com>
- Date: Sun, 9 May 2010 16:59:19 -0700
- To: www-style@w3.org
- Message-ID: <m2l736b692e1005091659z2bff1117oe549d13b7432b21b@mail.gmail.com>
Perhaps the spec would be made clear if it provided some more detailed
examples as to what should do what? I created a test file, just to see what
different browsers did, and all of them did different things (except
Chrome/Safari). Here was my HTML:
<html>
<head>
<style type="text/css">
p.t {content: "hello";}
p.b:hover {content: "hello";}
p.c:before {content: "hello";}
p.d {content: url(http://www.w3.org/2008/site/images/logo-w3c-mobile-lg);}
p.e:hover {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg);}
p.f:before {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg);}
p.g {content: url(http://www.w3.org/2008/site/images/logo-w3c-mobile-lg)
"hello";}
p.h:hover {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg) "hello";}
p.i:before {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg) "hello";}
a.t {content: "hello";}
a.b:hover {content: "hello";}
a.c:before {content: "hello";}
a.d {content: url(http://www.w3.org/2008/site/images/logo-w3c-mobile-lg);}
a.e:hover {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg);}
a.f:before {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg);}
a.g {content: url(http://www.w3.org/2008/site/images/logo-w3c-mobile-lg)
"hello";}
a.h:hover {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg) "hello";}
a.i:before {content: url(
http://www.w3.org/2008/site/images/logo-w3c-mobile-lg) "hello";}
</style>
</head>
<body>
<p class="t">Heihruih irerh</p><p class="b">Heihruih irerh</p><p
class="c">Heihruih irerh</p>
<p class="d">Heihruih irerh</p><p class="e">Heihruih irerh</p><p
class="f">Heihruih irerh</p>
<p class="g">Heihruih irerh</p><p class="h">Heihruih irerh</p><p
class="i">Heihruih irerh</p>
<a class="t" href="hth">Heihruih irerh</a><br /><a class="b"
href="hth">Heihruih irerh</a><br /><a class="c" href="hth">Heihruih
irerh</a>
<a class="d" href="hth">Heihruih irerh</a><br /><a class="e"
href="hth">Heihruih irerh</a><br /><a class="f" href="hth">Heihruih
irerh</a>
<a class="g" href="hth">Heihruih irerh</a><br /><a class="h"
href="hth">Heihruih irerh</a><br /><a class="i" href="hth">Heihruih
irerh</a>
</body>
</html>
In Opera (10.10), it acted most how I expected it too - replacing the right
text, responding to :hover for p's and anchors, and adding both images and
text whenever they occur. In Chrome (beta) and Safari (4.04), it never works
for the :hover psuedo-class, and replacing content only works if there's no
text. In Firefox 3.5.3, it ignores replacement text and the :hover
psuedo-class.
What would be the currently correct implementation?
~6 out of 5 statisticians say that the number of statistics that either make
no sense or use ridiculous timescales at all has dropped over 164% in the
last 5.62474396842 years
~6 out of 5 statisticians say that the number of statistics that either make
no sense or use ridiculous timescales at all has dropped over 164% in the
last 5.62474396842 years.
On Sun, May 9, 2010 at 10:22 AM, L. David Baron <dbaron@dbaron.org> wrote:
> On Sunday 2010-05-09 10:04 -0700, Tab Atkins Jr. wrote:
> > On that note, what should happen with the following?
> >
> > p { content: url(image); }
> > p::before { content: "foo"; }
> >
> > I presume it should fall under the same "undefined" banner that
> > setting img::before does, correct?
>
> I think it falls under the same "guaranteed not to show up" banner
> as img::before does. (I think that's what css3-content should say;
> I think we just didn't want to make CSS 2.1 incompatible with the
> examples in CSS2.)
>
> -David
>
> --
> L. David Baron http://dbaron.org/
> Mozilla Corporation http://www.mozilla.com/
>
>
Received on Sunday, 9 May 2010 23:59:53 UTC