Ik ben bezig met een responsive website welke gebruikt maakt van wat iframes. Het valt me op dat de mobiele telefoon de width & height attribute van een iframe negeert. Is er iemand die hiervoor een oplossing weet? Ik heb het ook al via CSS geprobeerd in te stellen maar dit werkt ook niet.

Open onderstaande pagina maar eens op mobiel en op je desktop dan zie je wat ik bedoel.
http://www.skebantje.nl/test.php

Alvast bedankt!

ik zou geen gebruik maken van iframes, dat is vreselijk irritant met scrollen. Dan krijg je een scroll in een scroll.

Dat is een ander punt maar het moet wel zo opgelost worden. Als je de iframe gewoon een goede hoogte mee geeft zal dit geen scroll in een scroll zijn.. maar graag weer on topic

iframe een id of class geven (bv iframe) en standaard breedte geven, deze met een media query verkleinen als het een iphone betreft:

@media only screen
and (max-width : 480px) {
#iframe {
width:320px;
}
}


bijvoorbeeld.

en als je aan responsive begint wel ook de andere benodigde meta code etc gebruiken.

Hier je oplossing: http://www.kootstradevelopment.nl/test/responsive.html

Let wel heeft totaal geen zin aangezien de iframe url niet responive is waardoor je altijd scrollbars krijgt.