skip to Main Content

I am using antd framework for making a table with sorter column. How can I make the tooltip aligned above the sorter icon? Here’s the snippet of my UI.

enter image description here

I added this prop inside the column, date.

showSorterTooltip={{title: 'Click to sort', placement: 'topRight', arrowPointAtCenter: false, autoAdjustOverflow: true}}

2

Answers


  1. showSorterTooltip accepts Tooltip props.
    Try adding ‘align:{ offset: [x, y] }’ in showSorterTooltip. You can adjust x and y: https://github.com/ant-design/ant-design/issues/21337

    This does not work after antd 5.3.0: https://ant.design/docs/blog/tooltip-align

    Login or Signup to reply.
  2. ShowSorterTooltip accept Tooltip tips,

    align: {offset: [x, y] }} />

    Calculate the position of the arrow on the table column, and then use it to offset the x and y

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search