There are three major ways I prefer to use when RTLing a webpage. Each one has its own pros and cons. They are actually the same..flipping CSS properties and rules is the same procedure in all ways. What's different is where and how are we flipping them.
Now we'll start flipping the CSS. Copy the ltr folder and rename the new one rtl (It's ready in the Source you'll download, you can move it to another place if you want to practice it yourself).
In the index.html file change the path of the css file from ltr/styles.css to rtl/styles.css (what we did here is linking the new file we're going to flip)
Open the styles.css file in your new rtl folder to start flipping it.
Now that everything is ready (a browser and a simple editor), we can start RTLing the simple hello world page. I'll be using Firefox and Notepad++ in this tutorial.
The SRC of this tutorial is available at the end of this post. You'll find the HTML file with both LTR and RTL stylesheets and images.
In this tutorial we'll take a simple HTML/CSS template and we're going to flip its direction from LTR to RTL. Simply this Hello World Page is going to be RTLed.
Recent comments