Before and After Pseudo Elements

Before and After Pseudo Elements (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets

Message

jaybee -> Before and After Pseudo Elements (9/19/2005 9:48:20)
Has anybody ever got these to work? If so, which browser and how?

d a v e -> RE: Before and After Pseudo Elements (9/19/2005 10:18:48)
think i played with them in firefox but didn't really need them anyway more info here http://www.w3.org/TR/CSS21/page.html#propdef-page-break-before

Tailslide -> RE: Before and After Pseudo Elements (9/19/2005 10:40:09)
I don't believe IE recognises them so I've never really bothered much - along with all the other cool stuff in CSS2 that there's no point in playing with until a certain large software corporation gets its arse in gear. Only time I use them is in Fat Erik's breadcrumb menu : http://css.maxdesign.com.au/listamatic/horizontal33.htm Which uses the before psuedo class and has a border effect so that IE plays nice.

jaybee -> RE: Before and After Pseudo Elements (9/19/2005 10:45:30)
Yes, I read the w3c stuff but I'm trying to use a sound file and nada, nix, zip.

caz -> RE: Before and After Pseudo Elements (9/19/2005 10:59:08)
I have used them for the float clearing method described here, http://www.csscreator.com/attributes/containedfloat.php Of course IE encloses floats (wrongly) anyway, but the righteous browsers get it.

d a v e -> RE: Before and After Pseudo Elements (9/19/2005 11:04:34)
quote: a sound file and nada, nix, zip that's where you're going wrong then. 'nada' isn't supported by IE, 'nix' is too old and zip.. well zip is zip :)

jaybee -> RE: Before and After Pseudo Elements (9/19/2005 14:06:23)
Oh ha ha. Thought I'd try and be clever with putting sound on the page rather than EMBED etc or JS. Huh. Well that was a waste of time.

d a v e -> RE: Before and After Pseudo Elements (9/19/2005 14:10:52)
oh you mean for an audio stylesheet?? like http://www.w3.org/TR/CSS21/aural.html#propdef-pause-before or http://www.w3.org/TR/CSS21/aural.html#propdef-cue-before ?? nope never tried that...

womble -> RE: Before and After Pseudo Elements (9/19/2005 16:31:09)
quote: 'nix' is too old I do hope Nicole doesn't hear you calling her old - she's liable to come round and slap you! [:D]

jaybee -> RE: Before and After Pseudo Elements (9/19/2005 16:35:14)
No, not an audio stylesheet just sound on the page. You can apparently (according to w3c) do a before or after on a tag and have the url as a sound file.

Nicole -> RE: Before and After Pseudo Elements (9/19/2005 17:24:03)
Don't worry Womble, I'd only come around and slap someone if they were a slaphead!

womble -> RE: Before and After Pseudo Elements (9/19/2005 17:46:22)
[:D][;)]

coreybryant -> RE: Before and After Pseudo Elements (9/19/2005 17:55:06)

I ahve been able to get the to work properly. One code I am using:

div.nav a:link, div.nav a:visited 
{
     color: #330099;
     font-size: 0.8em;
}
div.nav a:hover, div.nav a:active
{
     color: #990000;
     text-decoration: none;
}

with a DOCTYPE of

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

seems to work fine on my site. There is a pretty good thread here about it as well (even though it did go off topic a bit) :)

caz -> RE: Before and After Pseudo Elements (9/19/2005 18:03:54)
quote: ORIGINAL: Nicoleoz Don't worry Womble, I'd only come around and slap someone if they were a slaphead! Would that be a pseudo class of :after [8\|]

jaybee -> RE: Before and After Pseudo Elements (9/19/2005 18:24:13)
Crumbs Corey, you had me worried there for a minute. It's not pseudo classes in general I'm having trouble with, I use them all the time, it's the specific pseudo classes :before and :after. W3c example of what I'm trying to do.... quote: CSS2 - The :before Pseudo-element The ":before" pseudo-element can be used to insert some content before an element. The style below will play a sound before each occurrence of a header one element. h1:before { content: url(beep.wav) } CSS2 - The :after Pseudo-element The ":after" pseudo-element can be used to insert some content after an element. The style below will play a sound after each occurrence of a header one element. h1:after { content: url(beep.wav) } But it won't work. I don't get any errors but I don't get any sound either. [&:]

coreybryant -> RE: Before and After Pseudo Elements (9/19/2005 18:55:00)
Ah sorry, I read that but it did not compute - until now. I can ask the guys and gals over there at IWDN to see if they have any suggestions though if you would like. (Or you can :)) - I bother them all the time for those types of questions

jaybee -> RE: Before and After Pseudo Elements (9/20/2005 4:11:59)
Thanks Corey. I had a quick hunt around the w3c lists and I think maybe I'm trying to do something it was never meant to do. I have a sneaking suspicion that the sound is only rendered if you are using aural stylesheets.

d a v e -> RE: Before and After Pseudo Elements (9/20/2005 10:46:23)
ah like this quote: oh you mean for an audio stylesheet?? ok i called it audio... check out this side bar for firefox - (well bookmark it and it will display in the sidebar, i think! http://people.opera.com/rijk/panels/css2.1-online/prop-visual.html

coreybryant -> RE: Before and After Pseudo Elements (9/20/2005 10:58:51)
We actually had this conversation over there at IWDN a few weeks ago actually (memory is coming back :) ). Generated Content is where they have to be used. If I am remembering correctly, it is something close to Automatic counters and numbering and Opera provided a little support but that was it.

jaybee -> RE: Before and After Pseudo Elements (9/20/2005 11:02:05)
quote: oh you mean for an audio stylesheet?? Yes, no, I mean..... I thought it was nothing to do with that to begin with. It's not in the Aural bit in W3C so I figured it was standalone.

jaybee -> RE: Before and After Pseudo Elements (9/20/2005 11:05:17)
quote: Generated Content is where they have to be used. Oh well, forget that then. Rats. I've got a game done in css and html. No flash, no java, no js. Loads like lightening and brill for little kids hitting the client's site but....... They want it to make a helicopter noise when the kids hover the mouse over the helicopter. [&:] So I got all excited about a:before {url(helicopter.wav)} Oh well, never mind. Out comes the javascript.

jaybee -> RE: Before and After Pseudo Elements (9/20/2005 11:20:37)
Ahhhh, the plot unthickens! Seems the :before { url() does work but only if you happen to be using Netscape Navigator 6.0 or 7.0. Well that's handy then [image]http://www2.flirtlife.de/images/smiles/grummel.gif[/image]

Page: [1]

0.078125