8

I have HTML markup with a text paragraph in the body element. In the CSS stylesheet, I added:

body {
  text-align: justify;
  color: black;
  background-color: white;
  font-size: 23;

  letter-spacing:0.05pt;
  line-height: 125%;
  font-size: 1.25em;
  margin: 0.00em 20em;
  text-indent: 0em; 
  font-weight: normal;
  font-style: normal;
  direction: rtl;
}

When I load it in Safari 10.1, the text goes outside of the body border. But the same markup in an older version of Safari (10.0) works fine and in Chrome 56.0.2924.87 (x86_64).

How do I fix the markup and style in order for this to work in the new Safari?

Armen Michaeli
  • 8,625
  • 8
  • 58
  • 95
Ido Meirov
  • 81
  • 4
  • Can you be more specific? This looks OK to me except in a narrow viewport, but that's because of your `20em` left and right `margin`. http://codepen.io/anon/pen/xdxYVW – Michael Coker Apr 12 '17 at 22:32
  • Maybe you just need to set a different kind of relative width on `body` and use left/right `margin: auto` to center it? http://codepen.io/anon/pen/KmKQMg – Michael Coker Apr 12 '17 at 22:33
  • This problem exists for right-to-left languages like Arabic – Multithreader Apr 13 '17 at 01:02
  • Please edit the question to say that the problem is specific to right-to-left languages. Thank you! – Multithreader Apr 13 '17 at 01:12
  • @Multithreader is right. After testing it seems to not occur with latin characters, but arabic characters for example. See a Pen of the problem here: https://codepen.io/anon/pen/zwvWbJ and a **screenshot** here: https://imgur.com/a/YzsGP – Marijan Apr 18 '17 at 14:21

1 Answers1

4

it's officially a safari 10.1 bug. you can rate this post on apple communities maybe they fix it sooner . safari 10.1 text-align: justify Bug

reza saeb
  • 94
  • 1
  • 6
  • 2
    The OP asked a question for a solution and not the bug he actually opened...A possible solution or a hack is what he need – OhadM Apr 18 '17 at 08:12
  • I don’t think there is a hack, @OhadM. I researched this problem, too. No fix in sight. Also see http://stackoverflow.com/questions/43184042/ios-10-3-safari-text-alignjustify-bug-for-persian-arabic-content – Marijan Apr 18 '17 at 14:17
  • This is why there is a bounty :) – OhadM Apr 18 '17 at 14:32