iFrame Responsive
Die Skalierung von Inhalten die per iFrame eingebunden werden lässt doch sehr zu wünschen übrig.
Der erste iFrame wurde per Widget > Struktur > iFrame eingebunden, das zweite per CSS in einem responsiven DIV dargestellt.
Zum testen einfach das Browserfenster in der Breite verkleinern und das Verhalten der Skalierung beobachten.
per Widget > Struktur > iFrame eingebunden
per CSS in einem responsiven DIV eingebunden
<style>
.elastic-frame {
position: relative;
padding-bottom: 55%;
padding-top: 15px;
height: 0;
overflow: hidden;
}
.elastic-frame iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
<div class="elastic-frame"><iframe width="900" height="500"
src="http://www.zp-widgets.de/" frameborder="0"
allowfullscreen></iframe></div>
