Minor layout issue

Use this forum for HELP at Choral Public Domain Library as well as FEEDBACK
Robert Urmann
Posts: 19
Joined: 10 Jan 2009 01:40
Location: Leipzig, Germany

Re: Minor layout issue

Post by Robert Urmann »

Dear all,

I'm sorry, that this causes so much trouble! I know about the " " problem, too. Thank you very much for releasing all these ignorant IE candidates, Bill!!!

May I suggest a more simple solution that derives from Carlos' great idea using the word-spacing property in CSS? You all try to solve the spacing/kerning by means of whitespaces – breakable or not. The only thing is (and I might assume that's in accordance with Bringhurst) that there are no spaces allowed in this case. But: we can alter the extent of single characters by applying the margin/padding properties in CSS. That means

Code: Select all

<span style="padding-left:0.167em;">)</span>
produces space towards the preceding character without extra whitespace. If older browsers can't cope with it, it will be ignored resulting in no space in-between.

I thought (as a "remedy" for all the trouble) I write a small script for you to play around with some values using padding/margin as well as em and px units. Maybe you can post the best-looking combination here. I've tested it with many browsers at home, but I can't catch all the versions in the wild.

http://www.golden-ears.de/spacing.php

Yours,
Robert
CHGiffen
Site Admin
Posts: 1781
Joined: 16 Sep 2005 21:22
Location: Hudson, Wisconsin, USA

Re: Minor layout issue

Post by CHGiffen »

Hi Robert,

Thank you for your suggestion. The whole problem with Carlos's approach had been that, although it worked fine "inline", the

<span style="word-spacing:1px;"> </span>

declaration was being ignored inside the template:spc. After some experimentation, I discovered that

<span style="margin-left+0.083em"></span>

does exactly the right thing to produce a hairspace, even from within the template:spc !!!!! So now the template:spc produce from 0 through 6 hairspaces: {{spc|n}} yields n hairspaces. {{spc}} produces one hairspace.

Thanks again!

Chuck
Charles H. Giffen
CPDL Board of Directors Chair
Admin at & Manager of ChoralWiki
Robert Urmann
Posts: 19
Joined: 10 Jan 2009 01:40
Location: Leipzig, Germany

Re: Minor layout issue

Post by Robert Urmann »

Chuck,

thanks a lot for this microtype work! It looks great (also in IE [8], while I love my Firefox), but there is one last remark: the code now produces empty span warnings (because the <span> object is indeed filled with nothing). That's why I embedded the closing paren within the span element in my example. The final step to stay (X)HTML conform would be to set the opening paren's right margin as well as the closing paren's left margin to the additional 0.083 em. I think we're then finished.

Still, I would love to have Template:spc maintained as a handy tool to insert narrow non-breaking spaces.

Again: thank you all for your support and your patience!

Robert
carlos
Site Admin
Posts: 1870
Joined: 19 Aug 2008 15:26
Location: São Paulo, Brasil

Re: Minor layout issue

Post by carlos »

I don't think that a similar thin space is necessary before the italics: since the italics font leans toward the right parenthesis and naturally gets away from the left parenthesis, only the right side risks clashing text and parenthesis. If we put an identically sized space in both sides, I get the impression that the distances are not balanced...
Robert Urmann
Posts: 19
Joined: 10 Jan 2009 01:40
Location: Leipzig, Germany

Re: Minor layout issue

Post by Robert Urmann »

I agree. I just referred to what Chuck has inserted.

Robert
CHGiffen
Site Admin
Posts: 1781
Joined: 16 Sep 2005 21:22
Location: Hudson, Wisconsin, USA

Re: Minor layout issue

Post by CHGiffen »

carlos wrote:I don't think that a similar thin space is necessary before the italics: since the italics font leans toward the right parenthesis and naturally gets away from the left parenthesis, only the right side risks clashing text and parenthesis. If we put an identically sized space in both sides, I get the impression that the distances are not balanced...
Actually, for italic letters with descenders (g,j,p,q,y) there may be a problem if these are immediately preceded by an upright left parenthesis, because usually, the descender part is shifted to the left, just as the ascender part is shifted to the right. However, depending upon the design, the amount of descender shift to the left might be half that of the amount of ascender shift to the right ... this will happen when the baseline (the line through the bottom of nondescending letters) is kept fixed (unshifted). This is illustrated roughly by the following diagram, where the baseline (bbbbbb) is regarded as being unshifted):

normal ........... slanted
oooooo........|...oooooo...
oooooo........|..oooooo....
oooooo........|.oooooo.....
oooooo........|oooooo......
bbbbbb........bbbbbb.......
oooooo.......oooooo|.......
oooooo......oooooo.|.......

In a case such as this the characters which neither ascend nor descend (a,c,e,i,m,n,o,r,s,u,v,w,x,z) actually shift to the right by half as much as those characters which ascend (b,d,f,h,k,l,t).

To see these effects, one should try italicizing the symmetric examples "jof" (leading descender, trailing ascender) and "nu" (no ascender or descender). I'll put them in the documentation for Template:spc

Chuck
Charles H. Giffen
CPDL Board of Directors Chair
Admin at & Manager of ChoralWiki
Post Reply