Inserting text with CSS: IE7, a bad deal

Again, when I find myself writing about the capabilities of style sheets, I am forced to put aside Microsoft Internet Explorer! e after . With CSS2 introduced a very interesting feature, property, content , used in conjunction with pseudo-elements before and after . Through this "style" you can alter the contents of the site only by acting on the CSS file. For example if we write:

1
content : ">>" } li: before {content: ">>"}

) avrà ogni elemento preceduto dai caratteri “>>”! A bulleted list ( UL , LI ) will be preceded with every element ">>"! Anything, of course, can be treated in this way:

1
> fogli di stile < / span >< / p > < p > I can insert characters with < span > stylesheets </ span > </ p >
1
content : "-->" } div p: before {content: "-->"}

The versatility of this element does not stop there! It is possible to use other parameters in addition to the simple (but very useful) text. The element content , in fact, it also allows special values ​​or url:

1
2
3
content : url ( images/quote.gif ) } p: before {content: url (images / quote.gif)}
content : close-quote } p: after {content: close-quote}
content : url ( waves/sound.wav ) } p: before {content: url (waves / sound.wav)}

For implementation details refer directly to the W3C - shame it does not even Microsoft!

4 comments to "Insert text with CSS: IE7, a bad deal"

  1. June 10, 2008 Alex:

    Not to mention the attribute selectors css3 with li a[lang="en"] you can create different links depending on the language or something ...

  2. June 10, 2008 Giovambattista Fazioli :

    @ Alex: Good point! , anch'essi non completamente supportati da IE . As well as the pseudo :hover or :focus , also not fully supported by IE. I think it's a shame they can never get 100% of the potential of CSS ... spriamo that the situation will improve in the near future! :)

  3. June 11, 2008 Angel :

    It is said that the version 8 respect for most elements css. We hope! I often find myself in the position of having to find a compromise layout in order to feel good both on Firefox and Safari, Explorer and on .. Sometimes I am even tempted to give up the nonsense of explorer, and design using full CSS .. then we just think: if it were not for that about 70% of users are still on Explorer!

    Congratulations for your blog, hello to you soon!

  4. June 11, 2008 Giovambattista Fazioli :

    @ Angelo: I too often the same as "temptation" ;)

Leave a comment

XHTML TAG PERMIT: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION CODE:
 <pre></pre> // blocco generico <code></code> // blocco generico [cc_actionscript][/cc_actionscript] // Actionscript [cc_actionscript3][/cc_actionscript3] // Actionscript 3 [cc_css][/cc_css] // CSS Style Sheet [cc_html][/cc_html] // HTML [cc_js][/cc_js] // Javascript [cc_objc][/cc_objc] // Objective-C [cc_php][/cc_objc] // PHP [cc_sql][/cc_sql] // SQL 


Stop SOPA