{"action":"created","issue":{"url":"https://api.github.com/repos/webcompat/web-bugs/issues/896","labels_url":"https://api.github.com/repos/webcompat/web-bugs/issues/896/labels{/name}","comments_url":"https://api.github.com/repos/webcompat/web-bugs/issues/896/comments","events_url":"https://api.github.com/repos/webcompat/web-bugs/issues/896/events","html_url":"https://github.com/webcompat/web-bugs/issues/896","id":68182675,"number":896,"title":"comicbook.com - layout is messed up","user":{"login":"webcompat-bot","id":8862693,"avatar_url":"https://avatars.githubusercontent.com/u/8862693?v=3","gravatar_id":"","url":"https://api.github.com/users/webcompat-bot","html_url":"https://github.com/webcompat-bot","followers_url":"https://api.github.com/users/webcompat-bot/followers","following_url":"https://api.github.com/users/webcompat-bot/following{/other_user}","gists_url":"https://api.github.com/users/webcompat-bot/gists{/gist_id}","starred_url":"https://api.github.com/users/webcompat-bot/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/webcompat-bot/subscriptions","organizations_url":"https://api.github.com/users/webcompat-bot/orgs","repos_url":"https://api.github.com/users/webcompat-bot/repos","events_url":"https://api.github.com/users/webcompat-bot/events{/privacy}","received_events_url":"https://api.github.com/users/webcompat-bot/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/webcompat/web-bugs/labels/firefox","name":"firefox","color":"FF4E00"},{"url":"https://api.github.com/repos/webcompat/web-bugs/labels/needscontact","name":"needscontact","color":"e11d21"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-04-13T20:09:12Z","updated_at":"2015-04-14T00:45:52Z","closed_at":null,"body":"<!-- @browser: Firefox Mobile 40.0 -->\n<!-- @ua_header: Mozilla/5.0 (Android; Mobile; rv:40.0) Gecko/40.0 Firefox/40.0 -->\n\n**URL**: http://comicbook.com/2015/04/13/two-new-avengers-age-of-ultron-clips-released/\n**Browser / Version**: Firefox Mobile 40.0\n**Operating System**: Android \n**Problem type**: Layout is messed up\n\n**Steps to Reproduce**\n1) Navigate to: http://comicbook.com/2015/04/13/two-new-avengers-age-of-ultron-clips-released/\r\n2) …\r\n\r\nExpected Behavior:\r\nActual Behavior:\r\n"},"comment":{"url":"https://api.github.com/repos/webcompat/web-bugs/issues/comments/92547517","html_url":"https://github.com/webcompat/web-bugs/issues/896#issuecomment-92547517","issue_url":"https://api.github.com/repos/webcompat/web-bugs/issues/896","id":92547517,"user":{"login":"karlcow","id":505230,"avatar_url":"https://avatars.githubusercontent.com/u/505230?v=3","gravatar_id":"","url":"https://api.github.com/users/karlcow","html_url":"https://github.com/karlcow","followers_url":"https://api.github.com/users/karlcow/followers","following_url":"https://api.github.com/users/karlcow/following{/other_user}","gists_url":"https://api.github.com/users/karlcow/gists{/gist_id}","starred_url":"https://api.github.com/users/karlcow/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/karlcow/subscriptions","organizations_url":"https://api.github.com/users/karlcow/orgs","repos_url":"https://api.github.com/users/karlcow/repos","events_url":"https://api.github.com/users/karlcow/events{/privacy}","received_events_url":"https://api.github.com/users/karlcow/received_events","type":"User","site_admin":false},"created_at":"2015-04-14T00:45:52Z","updated_at":"2015-04-14T00:45:52Z","body":"it's not that much that the layout is messed up, but that youtube video are not being resized for smaller viewports. The Web site is responsive. The video will shrink until a certain lower limit. The same is happening in Chrome Mobile Blink.\n\nYou may want to contact the site owner about this usability issue. \n\n``` html\n<p>\n  <iframe src=\"https://www.youtube.com/embed/fPJ90rSpFvE\" \n    allowfullscreen=\"allowfullscreen\" \n    frameborder=\"0\" \n    height=\"368\" width=\"655\">\n  </iframe>\n</p>\n```\n\nThe CSS has a `min-width` of 600px for `iframe`.\nChanging the iframe CSS to `100%` fixes the issue.\n\n``` css\n.article-content iframe, .article-content object {\n    margin: 0px auto 20px;\n    display: block;\n    clear: both;\n    min-width: 100%;\n    min-height: 340px;\n}\n```\n\n```"}}