Right-to-Left Support

Right-to-left text direction support in Foundation allows you to easily switch text direction for all components.

Setup

Foundation 4 was built to support right-to-left text direction out of the box, but you'll need to make a couple of adjustments to your markup and SCSS to get everything up and running.

Markup Changes for Right-to-Left Layouts

You'll need to make a few changes to your markup to get the javascript components working nice and smooth. In the html tag, you'll need to add a dir attribute with a value of rtl. Here's what your html tag should look like:

<!-- This example is for a right-to-left Arabic layout --><htmlclass="no-js"lang="ar"dir="rtl">

This is a modal.

Reveal makes these very easy to summon and dismiss. The close button is simply an anchor with a unicode character icon and a class of close-reveal-modal. Clicking anywhere outside the modal will also dismiss it.

Finally, if your modal summons another Reveal modal, the plugin will handle that for you gracefully.