RTL and columns in Tablet, Mobile Landscape and Mobile Portrait views

Community resources Product feedback
#1

Hello folks,

I am designing an Arabic site which takes right to left direction, seems everything goes well so far but I’ve one issue.

When I move to phone portrait the columns appear reverse on the RTL site.

“A picture is worth a thousand words” :slight_smile:

Screen Shot 2014-01-28 at 10.17.29 AM.png1087×265 16.1 KB

Any suggestion?

Thanks

#2

float: right; right? :slight_smile: Set it’s float: left; and in custom code in dashboard add this:

<style>
  body {
    direction: rtl;
  }
</style>
#3

@myhusam How do you have it set up right now? Can you post your Public Link so we can see?

@bartekkustra we already have RTL support in the typography panel here:

:slight_smile:

#4

Oh sorry. Didn’t know… Must have missed it somehow… ;s Sorry :slight_smile:

#5

@bartekkustra THANKS a lot for your reply, me either i didn’t see this option :smile:

@thesergie THANKS for your help. I post a public link for a quick test because I am afraid the one I am developing won’t be clear for you; it’s on Arabic Language!

Here is the link:
http://rtl-test.webflow.com/

#6

Ok @myhusam you expect the order to go the opposite way? Do you expect all RTL websites to stack this way show below:

Desktop:

Content-3 Content-2 Content-1

Mobile:

Content-1
Content-2
Content-3

Can you show me a responsive RTL site that does this? Thanks!

#7

@thesergie Yeah exactly! Here is an example from Foundation:
http://zurb.com/playground/projects/foundation-rtl/demo/banded.html

#8

Thanks @myhusam. Currently RTL only affects the text behavior, not the column ordering. We’re figuring out a way to reverse the column order. Hold tight!

#9

For now, just add the following in your header:

<style>
.w-col {
    	float: right !important;
  	}
</style>

However, it won’t be visible until you publish.
If you want it in design mode, you have to either put the code above in a HTML Embed widget, or use Stylish.

Good luck :smiley:

#10

Any updates on re-ordering the stacking of columns?

#11

@thesergie @bart Any news on the ability to reverse certain columns when they stack? I have a few sites that have opposite content on either side but I’d like the to stack the same way on mobile.

1 Like
#12

We have something coming soon that will provide a solution for this.

3 Likes
#13

Hi, any news regarding this issue?

#14