{"action":"closed","issue":{"url":"https://api.github.com/repos/lorenzofox3/Smart-Table/issues/702","repository_url":"https://api.github.com/repos/lorenzofox3/Smart-Table","labels_url":"https://api.github.com/repos/lorenzofox3/Smart-Table/issues/702/labels{/name}","comments_url":"https://api.github.com/repos/lorenzofox3/Smart-Table/issues/702/comments","events_url":"https://api.github.com/repos/lorenzofox3/Smart-Table/issues/702/events","html_url":"https://github.com/lorenzofox3/Smart-Table/issues/702","id":170619483,"number":702,"title":"Tbody Td width equal to fixed td column header width.","user":{"login":"1Jesper1","id":4539406,"avatar_url":"https://avatars.githubusercontent.com/u/4539406?v=3","gravatar_id":"","url":"https://api.github.com/users/1Jesper1","html_url":"https://github.com/1Jesper1","followers_url":"https://api.github.com/users/1Jesper1/followers","following_url":"https://api.github.com/users/1Jesper1/following{/other_user}","gists_url":"https://api.github.com/users/1Jesper1/gists{/gist_id}","starred_url":"https://api.github.com/users/1Jesper1/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/1Jesper1/subscriptions","organizations_url":"https://api.github.com/users/1Jesper1/orgs","repos_url":"https://api.github.com/users/1Jesper1/repos","events_url":"https://api.github.com/users/1Jesper1/events{/privacy}","received_events_url":"https://api.github.com/users/1Jesper1/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2016-08-11T10:59:56Z","updated_at":"2016-09-05T15:53:34Z","closed_at":"2016-09-05T15:53:34Z","body":"Hello, I would like to improve the fixed header example in the documentation.\r\n\r\nIn the current example the header column width is not the same as the tbody element width. This is because of the vertical scrolling bar. \r\nI have created another directive for the td elements in the tbody.\r\nIn this directive I search for the width of the column in the header and give the td element in tbody this width. \r\nI also added overflow-x: hidden to the css of tbody.\r\n\r\n```\r\n#objectSearchTable > tbody {\r\n    overflow-y: auto;\r\n    overflow-x: hidden;\r\n}\r\n\r\n.directive('stRatio',`` function () {\r\n    return {\r\n        link: function (scope, element, attr) {\r\n            var ratio = +(attr.stRatio);\r\n\r\n            element.css('width', ratio + '%');\r\n        }\r\n    };\r\n}).directive('stRatio1', function () {\r\n    return {\r\n        link: function (scope, element, attr) {\r\n            var ratio = +(attr.stRatio1);\r\n            var trHeaderWidth = $('#objectSearchTable thead tr:first-child').width();\r\n            var finalWidth = (trHeaderWidth * ratio) / 100;\r\n\r\n            element.css(\"cssText\", \"min-width:\" + finalWidth + \"px;\");\r\n        }\r\n    };\r\n});\r\n```"}}
{"actor":{"display_login":"lorenzofox3"}}