{"id":2426,"date":"2016-04-26T07:57:02","date_gmt":"2016-04-26T14:57:02","guid":{"rendered":"http:\/\/www.wellgolly.com\/?p=2426"},"modified":"2016-04-26T07:57:02","modified_gmt":"2016-04-26T14:57:02","slug":"responsive-itunes-app-ad","status":"publish","type":"post","link":"https:\/\/www.wellgolly.com\/?p=2426","title":{"rendered":"Responsive iTunes App Ad"},"content":{"rendered":"<p>When redesigning a site, I was having trouble getting one section to fit on an iPhone 5 without horizontal scrolling. It turns out that there were two issues, one with the Facebook widget and\u2014rather ironically\u2014one with the iTunes App ad.<\/p>\n<p>The ad is in an iFrame and the dimensions are hard coded. e.g.<br \/>\n<pre><code class=\"preserve-code-formatting\">\necho &quot;&lt;iframe src=&#039;https:\/\/banners.itunes.apple.com\/banner.html?partnerId=0419Dm&amp;amp;aId=&amp;amp;id={$app_ID}&amp;amp;c=us&amp;amp;l=en-US&amp;amp;bt=catalog&amp;amp;t=catalog_white&amp;amp;w=300&amp;amp;h=250&#039; style=&#039;overflow-x:hidden;overflow-y:hidden;width:300px;height:250px;&#039;&gt;&lt;\/iframe&gt;&quot;;<\/code><\/pre><\/p>\n<p>Changing the dimensions either results in a cropped ad or nothing at all. I did however, stumble upon a solution. I reset the iFrame to 80% of the view window.<br \/>\n<pre><code class=\"preserve-code-formatting\">\niframe {\n&nbsp;&nbsp;max-width: 80vw;\n&nbsp;&nbsp;max-height: 80vw;\n}<\/code><\/pre><\/p>\n","protected":false},"excerpt":{"rendered":"<p>When redesigning a site, I was having trouble getting one section to fit on an iPhone 5 without horizontal scrolling. It turns out that there were two issues, one with the Facebook widget and\u2014rather ironically\u2014one with the iTunes App ad. The ad is in an iFrame and the dimensions are hard coded. e.g. echo &quot;&lt;iframe &hellip; <a href=\"https:\/\/www.wellgolly.com\/?p=2426\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Responsive iTunes App Ad<\/span><\/a><\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[28],"tags":[],"class_list":["post-2426","post","type-post","status-publish","format-standard","hentry","category-html-and-css"],"_links":{"self":[{"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=\/wp\/v2\/posts\/2426","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2426"}],"version-history":[{"count":0,"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=\/wp\/v2\/posts\/2426\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2426"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2426"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wellgolly.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2426"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}