Summarizing what Zibi and David said, I apply these rules of thumb:
1/ If your string is managed by l{1,20}n it should work 95% of cases.
Don't do anything. If not see 4/
2/ if you don't need ellipsis, use unicode-bidi: -moz-plaintext
(ellipsis are buggy with them right now). It has the advantage of not
affecting {margin,padding,border...}-inline-{start,end}.
3/ If you do need ellipsis, use dir="auto".
The default text-align in CSS is "start", that's why dir="auto" aligns
RTL content right. Solution: just force the alignment in CSS. Depending
on your context, you can even have global
html[dir="ltr"] { text-align: left; }
html[dir="rtl"] { text-align: right; }
in your application and override the few cases where you need other
alignments. We've done that for several apps, and it usually works well,
and it also deals with alignment for element with unicode-bidi:
-moz-plaintext.
if you use dir="auto", you generally cannot use any start/end property
though, so beware, you need to provide left/right alternative for both
rtl and ltr.
This should fix any parenthesis placement I'm aware of. If not see 4/
Normally, you shouldn't really need to use <bdi>. Note that ellipsis do
work with <bdi> but make sure they are added to the bdi element, and not
the parent... That probably requires you to add extra css rules for
that, so that might be better to use dir="auto" anyway.
4/ In other cases, FSI/PDI can help a lot (it serves as clue for the
BiDi algorithm to figure out which part of your string is LTR and which
is RTL), see [1]
Note that l{10,20}n already wraps latin element with FSI/PDI in
non-latin context. However in some rare cases, it might not be enough
[2]. In these cases, [RLM] can help.
I hope this helps. If it doesn't fix your use case, could you point
exactly where your problem is?
[1] http://s.codepen.io/autra/debug/WQgWRE I'm happy to maintain this
pen by adding any other strings that can cause you trouble.
[2] https://bugzilla.mozilla.org/show_bug.cgi?id=1217746
Augustin Trancart
Phoxygen
On 06/11/2015 08:03, [email protected] wrote:
First of all, there's "mozilla.dev.rtl" where they'll love your question and
are way better suited to answer it ;)
Barring that, I believe that FSI/PDI marks are super helpful here. We use them in l10n to
wrap variables and it usually helps with parenthesis. So maybe "foo
([FSI]foo[PDI])" will work?
I also know that Intl uses [RLM] which may also help here.
zb.
_______________________________________________
dev-fxos mailing list
[email protected]
https://lists.mozilla.org/listinfo/dev-fxos
_______________________________________________
dev-fxos mailing list
[email protected]
https://lists.mozilla.org/listinfo/dev-fxos
