<!DOCTYPE HTML>
<html lang="en">
    <title>Test Case for text-align: start/end</title>
    <h1 style="font-size: 1em;">Simple case</h1>
    <p dir="ltr" style="text-align:start">LTR Start
    <p dir="ltr" style="text-align:end">LTR End
    <p dir="rtl" style="text-align:start">RTL Start
    <p dir="rtl" style="text-align:end">RTL End
    <h1 style="font-size: 1em;">Inherited case</h1>
    <div style="text-align: start;"><p dir="ltr" style="text-align: inherit">LTR Start</div>
    <div style="text-align: end;"><p dir="ltr" style="text-align: inherit">LTR End</div>
    <div style="text-align: start;"><p dir="rtl" style="text-align: inherit">RTL Start</div>
    <div style="text-align: end;"><p dir="rtl" style="text-align: inherit">RTL End</div>
    <h1 style="font-size: 1em;">Inherited case where parent block has opposite directionality.</h1>
    <div dir="rtl" style="text-align: start;"><p dir="ltr" style="text-align: inherit">LTR Start</div>
    <div dir="rtl" style="text-align: end;"><p dir="ltr" style="text-align: inherit">LTR End</div>
    <div dir="ltr" style="text-align: start;"><p dir="rtl" style="text-align: inherit">RTL Start</div>
    <div dir="ltr" style="text-align: end;"><p dir="rtl" style="text-align: inherit">RTL End</div>
</html>
