Vytvorte každý prvok vo vnútri systému iframe - css, iframe, responsive-design

Mám iframe, ktorý zobrazuje reklamy. Chcem, aby bol citlivý takým spôsobom, že každý užívateľ s inou veľkosťou obrazovky ho môže vidieť so 100% šírkou namiesto pretekania prvku iframe. Ako to dosiahnuť?

odpovede:

Magazín Smashing už tento problém riešil iba pomocou CSS a kontajnerového prvku - Vstavaný citlivý dizajn

The Gist:

1. Vytvorte obal kontajnera pre daný iframe

2. Štýl nádoby;
   (ak bol názov triedy kontajnera nazvaný „video-container“)

   .video-container {
   Pozícia: relatívna;
   spodná časť čalúnenia: 56,25%;
   čalúnenie: 35px;
   výška: 0;
   pretečenie: skryté;
   }

3. Štýl iframe vnútri kontajnera

   .video-container iframe {
   pozície: absolútna;
   hore: 0;
   vľavo: 0;
   šírka: 100%;
   výška: 100%;
   }

Dúfam, že to pomôže!
Pozrite si časť odkaz pre viac informácií

Skúste to:

iframe, object, embed {
max-width: 100%;
}