LayoutTests/fast/css/text-overflow-ellipsis.html

   1 <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
   2 <head>
   3 <style>
   4 .testDiv {
   5     width: 180px;
   6     height: 20px;
   7     border: 1px solid black;
   8     white-space: nowrap;
   9     overflow: hidden;
  10     margin: 0 0 20px 0;
  11 }
  12
  13 .forcertl {
  14     direction: rtl;
  15     unicode-bidi: bidi-override;
  16 }
  17
  18 .ellipsis {
  19     text-overflow:ellipsis;
  20 }
  21 </style>
  22 </head>
  23 <body>
  24
  25 This tests checks that the text-overflow:ellipsis property is handled correctly
  26 for bidi text.<br><br>
  27
  28 Pass if the ellipsis do not overlap the text and the underlines for the links are
  29 placed under the text and not the ellipsis.
  30 <br><br>
  31
  32 RTL:
  33 <div class="testDiv ellipsis" dir=rtl>
  34 כשהטקסט ערוך מדי נרצה להוסיף אליפסות בסוף שורה
  35 </div>
  36
  37 RTL Override:
  38 <div class="testDiv forcertl ellipsis" dir=rtl>
  39 Lorem ipsum dolor sit amet, consectetur adipiscing
  40 </div>
  41
  42 RTL link:
  43 <div class="testDiv forcertl ellipsis" dir=rtl>
  44 <a href=#>Lorem ipsum dolor sit amet, consectetur adipiscing</a>
  45 </div>
  46
  47 RTL with ltr content:
  48 <div class="testDiv ellipsis" dir=rtl>
  49 Lorem ipsum dolor sit amet, consectetur adipiscing
  50 </div>
  51
  52 RTL link with ltr content:
  53 <div class="testDiv ellipsis" dir=rtl>
  54 <a href=#>Lorem ipsum dolor sit amet, consectetur adipiscing</a>
  55 </div>
  56
  57 LTR link:
  58 <div class="testDiv ellipsis" dir=ltr>
  59 <a href=#>Lorem ipsum dolor sit amet, consectetur adipiscing</a>
  60 </div>
  61
  62 LTR:
  63 <div class="testDiv ellipsis" dir=ltr>
  64 Lorem ipsum dolor sit amet, consectetur adipiscing
  65 </div>
  66
  67 LTR with rtl content:
  68 <div class="testDiv ellipsis" dir=ltr>
  69 כשהטקסט ערוך מדי נרצה להוסיף אליפסות בסוף שורה
  70 </div>
  71
  72
  73 LTR with forced rtl content:
  74 <div class="testDiv ellipsis" dir=ltr>
  75 <span class=forcertl dir=rtl>
  76 Lorem ipsum dolor sit amet, consectetur adipiscing
  77 </span>
  78 </div>
  79
  80 LTR link with rtl content:
  81 <div class="testDiv ellipsis" dir=ltr>
  82 <a href=#>
  83 כשהטקסט ערוך מדי נרצה להוסיף אליפסות בסוף שורה
  84 </a>
  85 </div>
  86
  87 LTR link with forced rtl content:
  88 <div class="testDiv ellipsis" dir=ltr>
  89 <a href=#>
  90 <span class=forcertl dir=rtl>
  91 Lorem ipsum dolor sit amet, consectetur adipiscing
  92 </span>
  93 </a>
  94 </div>