mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-05-11 09:27:00 +02:00
c07e92fc7e
The previous implementation checked text-overflow and overflow-x on the text node's direct parent during inline item iteration. Since these are non-inherited properties, ellipsis only worked for text directly inside the block container, not when wrapped in inline elements like <span> or <a>. Move ellipsis truncation to a post-processing step after line boxes are constructed, checking the containing block instead.
27 lines
761 B
HTML
27 lines
761 B
HTML
<!doctype html>
|
|
<link rel="match" href="../expected/text-overflow.html" />
|
|
<style>
|
|
@font-face {
|
|
font-family: "Lato";
|
|
src: url("../../Assets/Lato-Bold.ttf");
|
|
}
|
|
div {
|
|
font: 16px/1 Lato;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
width: 75px;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.clip {
|
|
text-overflow: clip;
|
|
}
|
|
</style>
|
|
<div class="clip">This text gets clipped</div>
|
|
<div>This text gets an ellipsis</div>
|
|
<div style="width: 0px">Invisible</div>
|
|
<div style="width: 5px">abc</div>
|
|
<div><span>This text gets an ellipsis</span></div>
|
|
<div><a href="#"><span>This text gets an ellipsis</span></a></div>
|
|
<div><b>Bold</b> <span>then more text here</span></div>
|
|
<div><span style="float: left">F</span>Text after a float gets an ellipsis</div>
|