edit css von Elementen innerhalb von iframe
Ich verwende einen kostenlosen Instagram-Feed-Iframe-Code auf meiner Website und möchte die Größe der Bilder auf Mobilgeräten bearbeiten. Derzeit ist der Feed auf dem Desktop 2 Zeilen mit 5 Bildern. auf dem Handy möchte ich die Größe der Bilder auf 50% Breite erhöhen, so dass es 5 Zeilen mit 2 Bildern gibt. Ich öffne die Konsole und es sieht aus wie die Li.in-Kachel, die eine Breite benötigt: 50%; Wenn Sie sich das CSS dieses Elements ansehen, ist es .lightwidget.in-grid.in-grid-5 li mit einer Breite von 20%, aber ich brauche es, um 50% zu sein.
Ich benutze weebly, um die Seite zu erstellen, wenn das hilft und ja, ich füge ein
.lightwidget.in-grid.in-grid-5 li{
width:50% !important;
}
auf die Medienabfrage für Mobilgeräte "max width 480px".
dies ist der Einbettungscode, mit dem ich den Feed aufrufe.
<!-- LightWidget WIDGET --><script src="//lightwidget.com/widgets/lightwidget.js"></script><iframe src="//lightwidget.com/widgets/3c1052429c9753bfa460e4a0636864a3.html" id="lightwidget_3c1052429c" name="lightwidget_3c1052429c" scrolling="no" allowtransparency="true" class="lightwidget-widget" style="width: 100%; border: 0; overflow: hidden;"></iframe>
Offensichtlich, wenn die Webseite diesen Iframe rendert, ruft sie ein HTML-Dokument auf, das irgendwo gehostet wird ... Ich muss wissen, ob es eine Möglichkeit gibt, dieses CSS zu ändern.
hoffentlich habe ich das gut erklärt.
Vielen Dank