Home > front end >  Need to customize the styling of iframe in css
Need to customize the styling of iframe in css

Time:10-25

I have a iframe <div style="text-align: center;" data-quiz="#######" data-preview="true" data-offset="0" data-autoscroll="yes"></div>

<script src="https://marketingfx.leadshook.io/s/js_embed"></script>

<div  style="text-align: center;" data-quiz="#######" data-preview="true" data-offset="0" data-autoscroll="yes"></div>
<script src="https://marketingfx.leadshook.io/s/js_embed"></script>

and the output is a form i want to edit the form css. How can i edit the css?

CodePudding user response:

The JS generates an iframe pointing to a different origin.

If you had control over that origin you could change the page that was loaded to have different CSS. Alternatively you could add an API (using postMessage) so JavaScript on your page could request CSS changes on the page in the frame.

It doesn't appear you do have control over https://marketingfx.leadshook.io, however, so you can't do that.

It is someone else's webpage. You can't control how someone else's webpage looks.

This does appear to be a service that https://marketingfx.leadshook.io provides. They might provide a way to do that. Consult their documentation or talk to your contacts there.

CodePudding user response:

This question has been answered on Stack Overflow previously. Please see Override body style for content in an iframe

There are several answers in that post which should help.

  • Related