{"action":"created","issue":{"url":"https://api.github.com/repos/webcompat/webcompat.com/issues/940","repository_url":"https://api.github.com/repos/webcompat/webcompat.com","labels_url":"https://api.github.com/repos/webcompat/webcompat.com/issues/940/labels{/name}","comments_url":"https://api.github.com/repos/webcompat/webcompat.com/issues/940/comments","events_url":"https://api.github.com/repos/webcompat/webcompat.com/issues/940/events","html_url":"https://github.com/webcompat/webcompat.com/issues/940","id":138293708,"number":940,"title":"Width of Comment on Small screen","user":{"login":"magsout","id":1997108,"avatar_url":"https://avatars.githubusercontent.com/u/1997108?v=3","gravatar_id":"","url":"https://api.github.com/users/magsout","html_url":"https://github.com/magsout","followers_url":"https://api.github.com/users/magsout/followers","following_url":"https://api.github.com/users/magsout/following{/other_user}","gists_url":"https://api.github.com/users/magsout/gists{/gist_id}","starred_url":"https://api.github.com/users/magsout/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/magsout/subscriptions","organizations_url":"https://api.github.com/users/magsout/orgs","repos_url":"https://api.github.com/users/magsout/repos","events_url":"https://api.github.com/users/magsout/events{/privacy}","received_events_url":"https://api.github.com/users/magsout/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/webcompat/webcompat.com/labels/bug","name":"bug","color":"e11d21"},{"url":"https://api.github.com/repos/webcompat/webcompat.com/labels/good-first-patch","name":"good-first-patch","color":"009800"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2016-03-03T20:51:12Z","updated_at":"2016-03-08T14:10:25Z","closed_at":null,"body":"Comment doesn't take advantage of full with on small screen..\r\n\r\n![capture d ecran 2016-03-03 a 21 49 35](https://cloud.githubusercontent.com/assets/1997108/13509061/f7e2d7a0-e189-11e5-8f7d-73044c6f42de.png)\r\n"},"comment":{"url":"https://api.github.com/repos/webcompat/webcompat.com/issues/comments/193797879","html_url":"https://github.com/webcompat/webcompat.com/issues/940#issuecomment-193797879","issue_url":"https://api.github.com/repos/webcompat/webcompat.com/issues/940","id":193797879,"user":{"login":"magsout","id":1997108,"avatar_url":"https://avatars.githubusercontent.com/u/1997108?v=3","gravatar_id":"","url":"https://api.github.com/users/magsout","html_url":"https://github.com/magsout","followers_url":"https://api.github.com/users/magsout/followers","following_url":"https://api.github.com/users/magsout/following{/other_user}","gists_url":"https://api.github.com/users/magsout/gists{/gist_id}","starred_url":"https://api.github.com/users/magsout/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/magsout/subscriptions","organizations_url":"https://api.github.com/users/magsout/orgs","repos_url":"https://api.github.com/users/magsout/repos","events_url":"https://api.github.com/users/magsout/events{/privacy}","received_events_url":"https://api.github.com/users/magsout/received_events","type":"User","site_admin":false},"created_at":"2016-03-08T14:10:25Z","updated_at":"2016-03-08T14:10:25Z","body":"This line https://github.com/webcompat/webcompat.com/blob/master/webcompat/static/css/development/components/comment.css#L45\r\n\r\nWe need to add a media querie to handle this width only and only if `avatar`  is display. Without it,  `max-width` is useless.\r\n\r\nSomething like:\r\n\r\n```css\r\n  /* Body */\r\n  .wc-Comment-body {\r\n    position: relative;\r\n    flex: 1;\r\n    margin-left:.8em;\r\n  }\r\n\r\n  @media all and (min-width: 61.88em) {\r\n\r\n    .wc-Comment-body {\r\n      max-width: calc(100% - 59px);\r\n    }\r\n  }\r\n\r\n```"}}