Created by: malekpour
As we discussed on pull request #6409, RTL added in a separate rtl.less
file on branch 3.0.0-wip.
All components supported. The page rtl.html
, loads Bootstrap documentation .mustache
templates on the fly and renders RTL/LTR contents correctly without any modification.
Tested and worked with Chrome 23, FireFox 17 and IE10.
Developers can add RTL layout support to their current Bootstrap websites, simply by adding .rtl
CSS class to any HTML element. e.g:
<body class="rtl">...</body>
or dynamically
function switchLayout() {
$(document.body).toggleClass('rtl')
}
Another class, .mirror
is useful to change direction of arrows and font icons. See its functionality in 'Icons by Glyphicons' section of the demo.
Online Demo (buttons on navigation bar added to compare RTL/LTR layouts, F2 [RTL/LTR] and F3 [Mirror/Normal] keys also works and when modal popup is visible only hot keys will work)