Skip to content

GitLab

  • Projects
  • Groups
  • Snippets
  • Help
    • Loading...
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
T treasure
  • Project overview
    • Project overview
    • Details
    • Activity
    • Releases
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 12
    • Issues 12
    • List
    • Boards
    • Labels
    • Service Desk
    • Milestones
  • Merge requests 0
    • Merge requests 0
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Operations
    • Operations
    • Incidents
    • Environments
  • Packages & Registries
    • Packages & Registries
    • Container Registry
  • Analytics
    • Analytics
    • CI/CD
    • Repository
    • Value Stream
  • Wiki
    • Wiki
  • External wiki
    • External wiki
  • Snippets
    • Snippets
  • Members
    • Members
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • FE
  • treasure
  • Issues
  • #196

Closed
Open
Created Oct 10, 2023 by JayChen@JayChenOwner

ant4.x下 在table下使用tooltip,在极其特殊的情况下无法正确弹出弹窗

问题

image
这里显示内容是186px
image 实际上这里只是185.3px

问题与分析

ant通过一下代码,对数字类型宽度进行了修正。

font-variant: tabular-nums;
font-feature-settings: 'tnum';

如何修正?正常情况下,数字0和数字1的宽度是不同的。修正后就是相同的。会被取整

所以会怎么样?

我们设置了186px进行 ... 处理
可他修正了185.3px成了186px。那么他就会被... 处理,然而tooltip是否弹窗的判断方式,是通过js判断选中内容是否是186px。
可奇葩的是,js不遵循css逻辑,他获取到的宽度就是185.3px。
所以。。。js认为他不够资格去弹窗,而css任然他应该被 溢出...处理。

解决方案

通过设置如下代码进行修复

font-variant: normal;
font-feature-settings: normal;

有意思的是,ant5.x的table也做了这块bug的修复,只是4.x没管,可能是不再维护了

Assignee
Assign to
None
Milestone
None
Assign milestone
Time tracking