{"action":"closed","issue":{"url":"https://api.github.com/repos/react-component/tooltip/issues/14","labels_url":"https://api.github.com/repos/react-component/tooltip/issues/14/labels{/name}","comments_url":"https://api.github.com/repos/react-component/tooltip/issues/14/comments","events_url":"https://api.github.com/repos/react-component/tooltip/issues/14/events","html_url":"https://github.com/react-component/tooltip/issues/14","id":102440521,"number":14,"title":"When positioning element using transform translate, tooltip is not positioned correctly","user":{"login":"molson504x","id":4873425,"avatar_url":"https://avatars.githubusercontent.com/u/4873425?v=3","gravatar_id":"","url":"https://api.github.com/users/molson504x","html_url":"https://github.com/molson504x","followers_url":"https://api.github.com/users/molson504x/followers","following_url":"https://api.github.com/users/molson504x/following{/other_user}","gists_url":"https://api.github.com/users/molson504x/gists{/gist_id}","starred_url":"https://api.github.com/users/molson504x/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/molson504x/subscriptions","organizations_url":"https://api.github.com/users/molson504x/orgs","repos_url":"https://api.github.com/users/molson504x/repos","events_url":"https://api.github.com/users/molson504x/events{/privacy}","received_events_url":"https://api.github.com/users/molson504x/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-08-21T18:41:50Z","updated_at":"2015-08-21T19:35:18Z","closed_at":"2015-08-21T19:35:18Z","body":"I'm attempting to get an element directly in the middle of my window, so I'm using a common CSS trick:\r\n\r\n```css\r\nmodal {\r\nleft: 50%;\r\ntop: 50%;\r\ntransform: translate(-50%, -50%);\r\n}\r\n```\r\n\r\nOne of the elements in the transform is using the react-tooltip component to render a tooltip, however the tooltip renders where the window **WOULD HAVE** been rather than where the window is after the CSS transform takes place.\r\n\r\nIn the image, the text which is supposed to have the tooltip is circled, along with where the tooltip rendered.\r\n\r\n![result of transform](https://cloud.githubusercontent.com/assets/4873425/9416241/6d6e231a-4812-11e5-80be-1dadb7f1ee78.png)\r\n"}}