发表新帖
发表新帖

brackets displays wrongly for right to left display style

后端 未结
关注
6 944
终归单人心
终归单人心 2020-12-05 00:06

The html code



hello (world)

you will see a page like this:

(hello
相关标签:
6条回答
  • 野性不改
    2020-12-05 00:38

    Use ‏ before (. Ex: 

    <html dir="rtl">
<body>
<p>hello &rlm;(world)</p>
</body></html>

    if you are using javascript/svg Dom then

     aText = $('<span>').html(aText.replace("(","&rlm;(")).text();
 $("<p>").html(aText);

    for other special Charactors 

    function getRTLText(aText,aChar) {
        if ( aText != undefined && aText.replace){
            aChar = (aChar === undefined )?"(":aChar;
            aText = $('<span>').html(aText.replace(aChar,"&rlm;"+aChar)).text();
        }
        return aText;
}

    and call function

    getRTLText("March / 2018","/");

    0 讨论(0)
  • 梦毁少年i
    2020-12-05 00:41

    You just need to add the LRM character after the last bracket. HTML entity: &#x200E;

    <html dir="rtl">
<body>
<p>hello (world)&#x200E;</p>
</body></html>

    This tells the browser to interpret the brackets as left-to-right reading.

    0 讨论(0)
  • 悲&欢浪女
    2020-12-05 00:49

    Or better you can try in CSS

    *:after {
    content: "\200E‎";
}
    0 讨论(0)
  • 灰色年华
    2020-12-05 00:51

    If anyone has this issue in WordPress you can try this fix:

    https://gist.github.com/dtbaker/b532e0e84a8cb7f22f26

    function dtbaker_rtl_bracket_hack($content){
    if(is_rtl()){
        $content = preg_replace('#<p>([^<]+)\)\s*</p>#','<p>$1)&#x200E;</p>',$content);
        $content = preg_replace('#<p>\s*\(([^<]+)</p>#','<p>&#x200E;($1</p>',$content);
    }
    return $content;
}
add_filter('the_content','dtbaker_rtl_bracket_hack',100,1);
    0 讨论(0)
  • 轻奢々
    2020-12-05 00:52

    This is the correct bracket rendering for right to left text (apparently). This article gives a bit more info.

    http://www.i18nguy.com/markup/right-to-left.html

    The dir attribute is now depreciated.

    0 讨论(0)
  • 半阙折子戏
    2020-12-05 00:54

    Adding the special rlm character in css before and after your element solved all cases I've come across in Firefox and Chrome:

    *:after {
    content: "\200E‎";
}
*:before {
    content: "\200E‎";
}
    0 讨论(0)
 看不清?
提交回复
热议问题