{"action":"created","issue":{"url":"https://api.github.com/repos/jgm/pandoc/issues/1903","labels_url":"https://api.github.com/repos/jgm/pandoc/issues/1903/labels{/name}","comments_url":"https://api.github.com/repos/jgm/pandoc/issues/1903/comments","events_url":"https://api.github.com/repos/jgm/pandoc/issues/1903/events","html_url":"https://github.com/jgm/pandoc/pull/1903","id":55534915,"number":1903,"title":"Wrap code block HTML table in a div element","user":{"login":"sapek","id":449129,"avatar_url":"https://avatars.githubusercontent.com/u/449129?v=3","gravatar_id":"","url":"https://api.github.com/users/sapek","html_url":"https://github.com/sapek","followers_url":"https://api.github.com/users/sapek/followers","following_url":"https://api.github.com/users/sapek/following{/other_user}","gists_url":"https://api.github.com/users/sapek/gists{/gist_id}","starred_url":"https://api.github.com/users/sapek/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sapek/subscriptions","organizations_url":"https://api.github.com/users/sapek/orgs","repos_url":"https://api.github.com/users/sapek/repos","events_url":"https://api.github.com/users/sapek/events{/privacy}","received_events_url":"https://api.github.com/users/sapek/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":5,"created_at":"2015-01-26T20:45:17Z","updated_at":"2015-01-29T04:06:32Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/jgm/pandoc/pulls/1903","html_url":"https://github.com/jgm/pandoc/pull/1903","diff_url":"https://github.com/jgm/pandoc/pull/1903.diff","patch_url":"https://github.com/jgm/pandoc/pull/1903.patch"},"body":"Syntax highlighted code blocks are written out as HTML tables which are\r\nimpossible to format via styles for different screen widths. This means\r\nthat pandoc generated pages with code blocks must have a fixed minimal\r\nwidth, making them hard to read on narrower screens.\r\n\r\nWrapping the table in a `<div>` allows formating a code block that will\r\nhave a horizontal scroll bar if the content doesn't fit the screen\r\nwidth, by adding the following style:\r\n\r\n    div.sourceCode {\r\n        overflow-x: auto;\r\n    }\r\n\r\nThis enables pandoc to generate responsive HTML pages."},"comment":{"url":"https://api.github.com/repos/jgm/pandoc/issues/comments/71965945","html_url":"https://github.com/jgm/pandoc/pull/1903#issuecomment-71965945","issue_url":"https://api.github.com/repos/jgm/pandoc/issues/1903","id":71965945,"user":{"login":"timtylin","id":70117,"avatar_url":"https://avatars.githubusercontent.com/u/70117?v=3","gravatar_id":"","url":"https://api.github.com/users/timtylin","html_url":"https://github.com/timtylin","followers_url":"https://api.github.com/users/timtylin/followers","following_url":"https://api.github.com/users/timtylin/following{/other_user}","gists_url":"https://api.github.com/users/timtylin/gists{/gist_id}","starred_url":"https://api.github.com/users/timtylin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/timtylin/subscriptions","organizations_url":"https://api.github.com/users/timtylin/orgs","repos_url":"https://api.github.com/users/timtylin/repos","events_url":"https://api.github.com/users/timtylin/events{/privacy}","received_events_url":"https://api.github.com/users/timtylin/received_events","type":"User","site_admin":false},"created_at":"2015-01-29T04:06:32Z","updated_at":"2015-01-29T04:06:32Z","body":"My guess is that tables don't take well to the CSS overflow scrollbar property, or at least that it has poor browser support. \r\n\r\nNote that you can easily use filters to wrap all the code block elements around a div. "}}