让横幅广告响应

-1

朋友们！我的工作将横幅广告到我的网站，我已经加入到展示横幅的HTML是https://jsfiddle.net/1r1kydjz/2/让横幅广告响应

<div data-wrid="WRID-145664652759935473" data-widgettype="staticBanner" data-responsive="yes" data-class="affiliateAdsByFlipkart" height="90" width="728" style="text-align:center;"></div> 
<script async src="//affiliate.flipkart.com/affiliate/widgets/FKAffiliateWidgets.js"></script>

，我面对的是，我的横幅广告不响应的问题，我希望他们能够调整根据设备即手机，台式机和平板电脑。

我试过宽度：100％和其他提到的东西，但它没有帮助。

请注意，横幅广告位于动态创建的iframe中。

请让我知道，如果有任何职位，我可以参考。

在此先感谢。

来源

2016-02-28 Alok Gupta

而不是使用CSS（使用'width：100％'），有属性'width'和'height';你有没有试过改变这些？ –

是的，当我这样做的横幅对齐受到影响或横幅根本不显示。我在jsfiddle更新了我的横幅广告的css –

更新小提琴 - https://jsfiddle.net/1r1kydjz/10/

* {margin:0; padding:0;} 

div[data-wrid^=WRID] { 
    margin: 0 auto; 
    max-width:100% !important; 
} 

div[data-wrid^=WRID] img { 
    max-width:100% !important; 
    margin:0 auto; 
} 

iframe { 
    max-width:730px !important; 
    text-align:center !important; 
    margin:0 auto; 
} 

@media (max-width:730px) { 
    iframe { 
     max-width:100% !important; 
    } 
}

试试这个 - https://jsfiddle.net/1r1kydjz/5/

div[data-wrid^=WRID] { 
    margin: 0 auto; 
    width: 727px; 
    max-width:100% !important; 
} 

div[data-wrid^=WRID] img { 
    max-width:100% !important; 
} 

iframe { 
    max-width:100% !important; 
}

希望帮助！

来源

2016-02-28 14:57:00

它使广告响应，但对齐受到影响。 –

看到我的更新 - https://jsfiddle.net/1r1kydjz/10/ –

我看到了，仍然没有中央对齐。但我想这不是一个大问题，我会试着弄清楚。感谢解决方案使其响应。 –

如果您知道网站的所有可能的大小，则可以定义横幅的比例，然后在媒体查询中使用transform:scale。

来源

2016-02-28 14:48:26 ri0ter

让横幅广告响应

回答

相关问题