single-value-ref.html 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <!DOCTYPE HTML>
  2. <!--
  3. Any copyright is dedicated to the Public Domain.
  4. http://creativecommons.org/licenses/publicdomain/
  5. Test: text-overflow: <single value>, scrolled and non-scrolled tests, (bug 684266)
  6. -->
  7. <html class="reftest-wait"><head>
  8. <title>text-overflow: &lt;single value&gt;, scrolled and non-scrolled tests, (bug 684266)</title>
  9. <style type="text/css">
  10. @font-face {
  11. font-family: DejaVuSansMono;
  12. src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff);
  13. }
  14. html,body {
  15. color:black; background-color:white; font-size:16px; padding:0; margin:0; font-family:DejaVuSansMono;
  16. }
  17. body {padding:10px 40px;}
  18. div {
  19. width:100px;
  20. white-space:nowrap;
  21. }
  22. .hidden {overflow:hidden}
  23. .auto {overflow:auto}
  24. .autolong {overflow:auto; width:100%;}
  25. .scroll {overflow:scroll}
  26. .ltr { direction:ltr; unicode-bidi: bidi-override; }
  27. .rtl { direction:rtl; unicode-bidi: bidi-override; }
  28. .ltr.p { text-indent: -5px; padding-left: 40px; } /* overflow into padding, but not outside the padding edge */
  29. .rtl.p { text-indent: -5px; padding-right: 40px; } /* overflow into padding, but not outside the padding edge */
  30. .s { text-indent: -5px; } /* overflow start edge outside the padding edge */
  31. div.ltr {
  32. text-overflow: clip ellipsis;
  33. }
  34. div.rtl {
  35. text-overflow: ellipsis clip;
  36. }
  37. </style>
  38. <script>
  39. function scrolldivs() {
  40. var divs = document.getElementsByTagName('div');
  41. for (i = 0; i < divs.length; ++i) {
  42. var elm = divs[i];
  43. if (elm.hasAttribute('scroll')) {
  44. if (window.getComputedStyle(elm).direction == 'ltr')
  45. elm.scrollLeft = 8;
  46. else
  47. elm.scrollLeft = -8;
  48. }
  49. }
  50. document.documentElement.removeAttribute('class');
  51. }
  52. window.addEventListener("MozReftestInvalidate", scrolldivs, false);
  53. </script>
  54. </head>
  55. <body>
  56. <div class="ltr start p hidden">A long line that does not break (overflow:hidden)</div>
  57. <div class="ltr start p auto">A long line that does not break (overflow:auto)</div>
  58. <div class="ltr start p autolong">A long line that does not break (overflow:auto)</div>
  59. <div class="ltr start p scroll">A long line that does not break (overflow:scroll)</div>
  60. <div class="ltr start s hidden">A long line that does not break (overflow:hidden)</div>
  61. <div class="ltr start s auto">A long line that does not break (overflow:auto)</div>
  62. <div class="ltr start s autolong">A long line that does not break (overflow:auto)</div>
  63. <div class="ltr start s scroll">A long line that does not break (overflow:scroll)</div>
  64. <div scroll class="ltr start p hidden">A long line that does not break (overflow:hidden)</div>
  65. <div scroll class="ltr start p auto">A long line that does not break (overflow:auto)</div>
  66. <div scroll class="ltr start p autolong">A long line that does not break (overflow:auto)</div>
  67. <div scroll class="ltr start p scroll">A long line that does not break (overflow:scroll)</div>
  68. <div scroll class="ltr start s hidden">A long line that does not break (overflow:hidden)</div>
  69. <div scroll class="ltr start s auto">A long line that does not break (overflow:auto)</div>
  70. <div scroll class="ltr start s autolong">A long line that does not break (overflow:auto)</div>
  71. <div scroll class="ltr start s scroll">A long line that does not break (overflow:scroll)</div>
  72. <div class="rtl" style="float:right">
  73. <div class="rtl start p hidden">A long line that does not break (overflow:hidden)</div>
  74. <div class="rtl start p auto">A long line that does not break (overflow:auto)</div>
  75. <div class="rtl start p autolong">A long line that does not break (overflow:auto)</div>
  76. <div class="rtl start p scroll">A long line that does not break (overflow:scroll)</div>
  77. <div class="rtl start s hidden">A long line that does not break (overflow:hidden)</div>
  78. <div class="rtl start s auto">A long line that does not break (overflow:auto)</div>
  79. <div class="rtl start s autolong">A long line that does not break (overflow:auto)</div>
  80. <div class="rtl start s scroll">A long line that does not break (overflow:scroll)</div>
  81. <div scroll class="rtl start p hidden">A long line that does not break (overflow:hidden)</div>
  82. <div scroll class="rtl start p auto">A long line that does not break (overflow:auto)</div>
  83. <div scroll class="rtl start p autolong">A long line that does not break (overflow:auto)</div>
  84. <div scroll class="rtl start p scroll">A long line that does not break (overflow:scroll)</div>
  85. <div scroll class="rtl start s hidden">A long line that does not break (overflow:hidden)</div>
  86. <div scroll class="rtl start s auto">A long line that does not break (overflow:auto)</div>
  87. <div scroll class="rtl start s autolong">A long line that does not break (overflow:auto)</div>
  88. <div scroll class="rtl start s scroll">A long line that does not break (overflow:scroll)</div>
  89. </div>
  90. </body>
  91. </hml>