Set qTip2 direction from right to left (RTL)

Question

I am using qTip2 and try to make the content of the tip right to left.

I add below css to qtip but the direction no worked:

text-align: right !important; direction: rtl !important;

and the js as below still not worked! Although events should be enough, I see some comments about using onRender:

$(document).ready(function () {
    $('a[title]').qtip({
        events: {
        render: function (event, api) {
            $(this).attr('dir', 'rtl');
        }
    },
    api: {
        onRender: function () {
            self.elements.content.rel('rtl');
        }
    },    
});

});

I found above codes from site support forum, but none of them helped me.

Please see sample at http://jsfiddle.net/mnTCv/1/

Can you tell me how should I solve this issue?!

Answer 1

you must change this .qtip-content :

jsFiddle

.qtip-content {
    position: relative;
    padding: 5px 9px;
    overflow: hidden;
    text-align: right;   /*  default: left  */
    word-wrap: break-word;
}