| <!DOCTYPE html> |
| <style> |
| .container { |
| position: relative; |
| text-align: left; |
| text-indent: -100px; |
| height: 50px; |
| width: 200px; |
| border: solid; |
| font: 10px Ahem; |
| } |
| .rtl { |
| direction: rtl; |
| text-align: right; |
| } |
| |
| span { |
| position: absolute; |
| } |
| </style> |
| <script src="../../../resources/check-layout.js"></script> |
| <p>crbug.com/568851: text-indent should be applied to leading statically positioned out-of-flow objects.</p> |
| <div class="container"> |
| <span data-offset-x=-100>Text</span> |
| </div> |
| <div class="container"> |
| <span data-offset-x=-100 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container"> |
| Text<span data-offset-x=-60 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container"> |
| Text<br><span data-offset-x=0 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container"> |
| Text Text Text Text Text |
| Text<span data-offset-x=190 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container"> |
| <span data-offset-x=-100>Text</span> |
| </div> |
| <div class="container"> |
| Text<span data-offset-x=-60>Text</span> |
| </div> |
| <div class="container"> |
| Text<br><span data-offset-x=0>Text</span> |
| </div> |
| <div class="container"> |
| Text Text Text Text Text |
| Text<span data-offset-x=190>Text</span> |
| </div> |
| |
| <div class="container rtl"> |
| <span data-offset-x=300>Text</span> |
| </div> |
| <div class="container rtl"> |
| <span data-offset-x=300 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container rtl"> |
| Text<span data-offset-x=260 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container rtl"> |
| Text<br><span data-offset-x=200 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container"> |
| Text Text Text Text Text Text Text Text Text Text Text Text |
| Text<span data-offset-x=140 style="display:inline-block;">Text</span> |
| </div> |
| <div class="container rtl"> |
| <span data-offset-x=300>Text</span> |
| </div> |
| <div class="container rtl"> |
| Text<span data-offset-x=260>Text</span> |
| </div> |
| <div class="container rtl"> |
| Text<br><span data-offset-x=200>Text</span> |
| </div> |
| <div class="container"> |
| Text Text Text Text Text Text Text Text Text Text Text Text |
| Text<span data-offset-x=140>Text</span> |
| </div> |
| <script> |
| checkLayout(".container"); |
| </script> |