问题
My website was working and viewing well on every mobile browser of my iPhone before updating to 10.3. From the time I updated my iOS to 10.3, my content page faced an issue:
Content is wrapped in a <div> with CSS property of text-align: justify. My content is in Persian (Farsi).
The problem is: my text content overflows container and when I add a padding to the container to see if it is just overflowed, I found out that it isn't rendering it justified and it's showing it right aligned.
Is there anyone with this issue? Can anyone help?
Update I've added a codepen example: Click Here To Open Codepen
Update As you can see in the following screenshot, the red text is overflowed to the left sidebar:
回答1:
it's officially a safari 10.1 bug . things worked fine on older safari .
chrome and other browser worked fine in same device .
you can rate this post on apple communities maybe they fix it sooner . safari 10.1 text-align: justify Bug
回答2:
You can temporarily fix this problem by adding this code to your css:
@media not all and (min-resolution:.001dpcm) { @media {
.main {
text-align: right!important;
}
}}来源：https://stackoverflow.com/questions/43184042/ios-10-3-safari-text-alignjustify-bug-for-persian-arabic-content