Skip to content

The text-overflow: ellipsis; is not working #431

Open
Open
The text-overflow: ellipsis; is not working#431
Labels
Fails on FirefoxIssue specific to Firefox browserbugSomething isn't workingpriority: mediumFeature partially broken or degraded, workaround existssafari-hates-meIssue specific to Safari browser

Description

@mortyhuang
mortyhuang
opened on Jun 5, 2026

Describe it simply:

In Safari version 17.2, the ellipsis effect does not work.

Quick demo to reproduce

<script type="module">
  import { snapdom } from "https://unpkg.com/@zumer/snapdom/dist/snapdom.mjs";
  const img = await snapdom.toPng(document.querySelector('#card'));
  document.body.appendChild(img);
</script>
<style>
  .truncate {
  overflow: hidden;
  inline-size: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
</style>
<body>
   <div id="card">
       <div class="truncate">
        Lorem ipsum dolor, sit amet consectetur adipisicing elit. A, doloribus perferendis tempora molestiae aspernatur voluptas, libero placeat itaque minima alias eum eos sunt quos cupiditate optio laboriosam reprehenderit consectetur minus.
      </div>
   </div>
</body>
Image

Anything else we should know?

Snapdom * v2.12.8
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.2 Safari/605.1.15"

Metadata

Metadata

Assignees

No one assigned

    Labels

    Fails on FirefoxIssue specific to Firefox browserbugSomething isn't workingpriority: mediumFeature partially broken or degraded, workaround existssafari-hates-meIssue specific to Safari browser

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions