<!DOCTYPE html> <html class="reftest-wait"> <head> <title>text-align-unsafe</title> <meta charset="utf-8"> <style type="text/css"> p { overflow:hidden; width:8em; white-space:nowrap; margin:0; } .test1 p { text-align: unsafe right; text-align-last: end; } .test2 p { text-align: unsafe right; } .test3 p { text-align: end unsafe; } .test4 p { text-align: unsafe left; } .test5 p { text-align: left; text-align-last: unsafe right; } </style> </head> <body> <div class=test1> <p>Lorem ipsum dolor sit amet.</p> <p dir="rtl">ישים אל לבו חובתו אשר הוא מתעלם ממנה.</p> </div> <div class=test2> <p>Lorem ipsum dolor sit amet.</p> <p dir="rtl">ישים אל לבו חובתו אשר הוא מתעלם ממנה.</p> </div> <div class=test3> <p>Lorem ipsum dolor sit amet.</p> <p dir="rtl">ישים אל לבו חובתו אשר הוא מתעלם ממנה.</p> </div> <div class=test4> <p>Lorem ipsum dolor sit amet.</p> <p dir="rtl">ישים אל לבו חובתו אשר הוא מתעלם ממנה.</p> </div> <div class=test5> <p>Lorem ipsum dolor sit amet.</p> </div> <script> var elem = document.querySelector('.test5 p'); var a = window.getComputedStyle(elem,null).getPropertyValue("text-align"); document.body.appendChild(document.createTextNode(a +"|")); a = window.getComputedStyle(elem,null).getPropertyValue("text-align-last"); document.body.appendChild(document.createTextNode(a)); document.documentElement.removeAttribute('class'); </script> </body> </html>