I tried out fullCalendar in my page, but agenda views are out of alignment
when direction is right to left. I'm using ":lang" pseudo class and
content-language meta tag to manage direction and text alignment for
different locales.
Even with isRTL set to true, agendaWeek and agendaDay views are not
displaying properly when css direction is set to rtl and text-align to
right for all elements (with a * selector). I have slightly modified the
demo file agenda-views.html to illustrate this. With the following added
in the <head> section:
<meta http-equiv="content-language" content="ar" />
<style type="text/css">
* { direction: ltr; text-align: left; }
*:lang(ar) { direction: rtl; text-align: right; }
</style>
And "isRTL:true" in the fullCalendar arguments. I tried this in both
Firefox and IE with same results for agenda views. The month view is
working fine.
your css rules seem a bit heavy-handed with the *. this prevents elements inheriting the direction properties from their parent, which is bad. likely to break many other plugins/scripts as well. cant you do this instead? body { direction: ltr; text-align: left } :lang(ar) { direction: rtl; text-align: right } of course, this may very well break fullcalendar too. i'll close the issue for now, but respond if the above css also breaks it.