93 lines
2.1 KiB
HTML
93 lines
2.1 KiB
HTML
<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
|
|
<head>
|
|
<style>
|
|
.testDiv {
|
|
width: 180px;
|
|
height: 20px;
|
|
border: 1px solid black;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
margin: 0 0 20px 0;
|
|
}
|
|
|
|
.forcertl {
|
|
direction: rtl;
|
|
unicode-bidi: bidi-override;
|
|
}
|
|
|
|
.ellipsis {
|
|
text-overflow:ellipsis;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
This tests checks that the text-overflow:ellipsis property is handled correctly
|
|
for bidi text.<br><br>
|
|
|
|
Pass if the ellipsis do not overlap the text and the underlines for the links are
|
|
placed under the text and not the ellipsis.<br><br>
|
|
|
|
RTL:
|
|
<div class="testDiv ellipsis" dir=rtl>
|
|
כשהטקסט ערוך מדי נרצה להוסיף אליפסות בסוף שורה
|
|
</div>
|
|
|
|
RTL Override:
|
|
<div class="testDiv forcertl ellipsis" dir=rtl>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
</div>
|
|
|
|
RTL link:
|
|
<div class="testDiv forcertl ellipsis" dir=rtl>
|
|
<a href=#>Lorem ipsum dolor sit amet, consectetur adipiscing</a>
|
|
</div>
|
|
|
|
RTL with ltr content:
|
|
<div class="testDiv ellipsis" dir=rtl>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
</div>
|
|
|
|
RTL link with ltr content:
|
|
<div class="testDiv ellipsis" dir=rtl>
|
|
<a href=#>Lorem ipsum dolor sit amet, consectetur adipiscing</a>
|
|
</div>
|
|
|
|
LTR link:
|
|
<div class="testDiv ellipsis" dir=ltr>
|
|
<a href=#>Lorem ipsum dolor sit amet, consectetur adipiscing</a>
|
|
</div>
|
|
|
|
LTR:
|
|
<div class="testDiv ellipsis" dir=ltr>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
</div>
|
|
|
|
LTR with rtl content:
|
|
<div class="testDiv ellipsis" dir=ltr>
|
|
כשהטקסט ערוך מדי נרצה להוסיף אליפסות בסוף שורה
|
|
</div>
|
|
|
|
|
|
LTR with forced rtl content:
|
|
<div class="testDiv ellipsis" dir=ltr>
|
|
<span class=forcertl dir=rtl>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
</span>
|
|
</div>
|
|
|
|
LTR link with rtl content:
|
|
<div class="testDiv ellipsis" dir=ltr>
|
|
<a href=#>
|
|
כשהטקסט ערוך מדי נרצה להוסיף אליפסות בסוף שורה
|
|
</a>
|
|
</div>
|
|
|
|
LTR link with forced rtl content:
|
|
<div class="testDiv ellipsis" dir=ltr>
|
|
<a href=#>
|
|
<span class=forcertl dir=rtl>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
</span>
|
|
</a>
|
|
</div> |