Unofficial archive. This is a read-only, community-run archive of the Apple Support Community. It is not affiliated with or endorsed by Apple Inc.
malik_abdullahzafar
User level: Level 1 (4 points)

Arabic RTL text looks inconsistent on mobile browsers

I’m working with a small Arabic content website and I’ve noticed something a little odd on mobile browsers.

Arabic paragraphs generally display correctly, but on some pages the alignment and spacing can look inconsistent when the page also contains a small amount of English text.


In particular, line wrapping and punctuation sometimes look slightly different between Chrome and other mobile browsers.


I’ve already checked the basic RTL direction and text alignment settings, but I’m still trying to figure out whether this is mainly a CSS/layout issue or something related to the browser’s Arabic text rendering.


Has anyone else worked with Arabic RTL content and noticed similar behavior? I’d be interested to know what approach you use to keep Arabic and mixed Arabic/English text consistent across mobile browsers.

Posted on Sep 27, 2026 2:57 PM

3 replies

SravanKrA
User level: Level 10 (454,138 points)

Sep 28, 2026 1:19 AM in response to malik_abdullahzafar

If you are experiencing problems with RTL (Right-to-Left) direction, Arabic text alignment, or text positioning while developing a web page, the issue is generally related to the web page’s HTML/CSS configuration, the web-hosting environment, the browser’s text-rendering behaviour, or the way the page handles bidirectional text.


For example, incorrect or inconsistent use of CSS properties such as direction: rtl, text-align: right, unicode-bidi, flexbox/grid alignment, or the HTML dir="rtl" attribute can cause Arabic or other RTL languages to appear incorrectly. Browser-specific rendering differences, including how Chrome handles Arabic and bidirectional text, can also contribute to the problem.


This is not normally an iPhone or iOS issue. The iPhone is simply displaying or editing the web page; it does not determine how your website's underlying HTML, CSS, JavaScript, or server-side code is structured.


For web development, it is also preferable to develop and test the page on a Windows PC or Mac using a full desktop browser such as Chrome, Safari, Firefox, or Edge. Desktop development environments provide considerably better access to developer tools, CSS inspection, responsive testing, console logs, and source-code debugging than an iPhone.


Once the RTL layout has been correctly implemented on the desktop, you should then test the finished page on the iPhone to make sure the mobile layout and Arabic text rendering are also working correctly.


In short, first investigate the HTML/CSS, hosting environment, and browser rendering; don't treat the iPhone itself as the source of the RTL-direction problem.

Tom Gewecke
User level: Level 10 (124,784 points)

Sep 28, 2026 2:21 AM in response to malik_abdullahzafar

malik_abdullahzafar wrote:
Has anyone else worked with Arabic RTL content and noticed similar behavior? I’d be interested to know what approach you use to keep Arabic and mixed Arabic/English text consistent across mobile browsers.

It is extremely unlikely that you will find anyone here who composes Arabic webpages -- these forums are aimed at people who use Apple devices for simply viewing them.


One suggestion is that you find an Arabic web page which does not show the issues with different browsers that you describe and examine its CSS and other coding for elements that name specific browsers and may be aimed at dealing with their different behaviors with RTL scripts.

Originally posted at discussions.apple.com/thread/256366151