layout techniques - what is VOICE-FAMILY?

[none]

http://www.glish.com/css/7.asp

please view the link.
look for the "CENTERCONTENT" div source (it's on the page, no need to view the source itself.)

Can someone please explain :

voice-family: "\"}\"";
voice-family: inherit;


Thank you for any clarity you can provide on this matter.


none.be.l33t


***

[paul]

voice-family is similar to font-family, but for aural style sheets.

It has nothing to do with visual browsers and that is a damn ugly hack.

[none]

thanks paul.

***

[Brian Nickel]

That is an increadably ugly hack.
In case any of you are curious about adding a more interesting aural experiance for your site for the vision impared. The complete aural CSS definition is at http://www.w3.org/TR/REC-CSS2/aural.html

<font face='Courier New'><font color=brown>.Brian
It is best to remain silent and be thought a fool than to open your mouth and remove all doubt.</font id=brown></font id='Courier New'>

[Chris]

theres not much point in using the aural stylesheet definitions, as there isn't much (if any?) support for them yet...

[url="http://chrispoole.com"]<font color=orange>Chris</font id=orange>[/url:jzezdflrkz]

[none]

the voice-family info is a hack for the positioning of the divs (don't ask)...there's a link with some data about the reasoning behind the hack on the above listed link

***

[Brian Nickel]

The reasoning behind it is that if the browser is inferior, it will skip processing the style and catch the } in the definition causing it to exit the definition.
You have to think, at least they were courtious enough to return the value to default when they were done.

<font face='Courier New'><font color=brown>.Brian
It is best to remain silent and be thought a fool than to open your mouth and remove all doubt.</font id=brown></font id='Courier New'>

[Darkwolf]

This trick by Tantek Celik use an IE5 parsing bug.

width:208px; // value for IE5
voice-family: "\"}\"";
voice-family: inherit;
width:210px; // value for standard browsers

This is used essentially to correct IE5 incorrect box-model. That means a 100px div with 5px border will still be 100px in IE (border are inside); while correct model is outter borders so width will be 110px.

As ScriptGuru said, old browsers might have the same parsing bug (opera5 does i think and some others..) you can add a "be nice to opera" rule. See bluerobot.com you'll find somewhere a link to Celik's hack page.

As IE5 also have a non standard cursor property for links (it uses 'hand' but 'pointer' is good one) i tried to use it for that too .. but had pb and thanks to paul found a better way (see the post in crossbrowser forum).

To avoid old browsers to do the same as I5, I used a stylesheet called with an @import.

Doesn't that solve the pb ?

<font color=green><div id="<font color=navy>Nico Combelles</font id=navy>" style="<font color=navy>age: 22; nat: french; site: www.udhtml.com</font id=navy>"><img src=icon_smile_tongue.gif border=0 align=middle></div></font id=green>

[Brian Nickel]

To each his own, I guess. I don't support hacks in general though.