pseudo-element

There are a few references on the internet to ::-webkit-selection , a WebKit-specific version of the ::selection selector . See e.g. http://www.quirksmode.org/css/selection.html ( Edit: PPK has since removed ::-webkit-selection from that page.) However, I haven’t been able to get the example in the page above, or my own examples, to work in any WebKit-based browser. I’ve tried: Safari 1.0 1.2 2.0 3.0 4.0 5.0 5.1 Chrome 2 6 14 The unprefixed ::selection selector works in all of these browsers anyway, so it’s not really a problem. But I was wondering where the references to the WebKit-specific

I am new to pseudo-elements that are prefixed with a double colon. I came across a blog article discussing styling of scrollbars using some webkit only css. Can the pseudo-element CSS be applied to individual elements? /* This works by applying style to all scroll bars in window */ ::-webkit-scrollbar { width: 12px; } /* This does not apply the scrollbar to anything */ div ::-webkit-scrollbar { width: 12px; } In this fiddle, I would like to make the div's scrollbar customized, but the main window's scrollbar stay at the default. http://jsfiddle.net/mrtsherman/4xMUB/1/ Your idea was correct.

I have a set of styled links using the :before to apply an arrow. It looks good in all browser, but when I apply the underline to the link, I don't want to have underline on the :before part (the arrow). See jsfiddle for example: http://jsfiddle.net/r42e5/1/ Is it possible to remove this? The test-style I sat with #test p a:hover:before does get applied (according to Firebug), but the underline is still there. Any way to avoid this? #test { color: #B2B2B2; } #test p a { color: #B2B2B2; text-decoration: none; } #test p a:hover { text-decoration: underline; } #test p a:before { color: #B2B2B2;

I would like to use a switch for the layout of paragraph tags on a webpage. I use the after pseudoelement p:after {content: url("../img/paragraph.gif");} Now i need to remove this css code from the page. How can this be done easily (jquery is already used on the page)? (i do not want to include or remove files containing css) Gillian Lo Wong p:after { content: none; } none is the official value to set the content, if specified, to nothing. http://www.w3schools.com/cssref/pr_gen_content.asp Gabriele Petrioli You need to add a css rule that removes the after content ( through a class ).. An

I have a list of elements, which are styled like this: ul { list-style-type: none; text-align: center; } li { display: inline; } li:not(:last-child):after { content:' |'; } <ul> <li>One</li> <li>Two</li> <li>Three</li> <li>Four</li> <li>Five</li> </ul> Outputs One | Two | Three | Four | Five | instead of One | Two | Three | Four | Five Anyone know how to CSS select all but the last element? You can see the definition of the :not() selector here If it's a problem with the not selector, you can set all of them and override the last one li:after { content: ' |'; } li:last-child:after { content: '