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

Antworten auf die Frage(2)

Ihre Antwort auf die Frage