transparent background/responsive content


Hope you can help me with a couple questions!

Tested with firefox and chrome with same results.

So I have some content created on h5p and embeded on our moodle website (last version).

1st issue: in all embed contents the background isn't transparent even when the image is. How can I make it to be transparent?
You can take a look here:

2nd issue: my original image size is 845x430 px but when I copy the iframe I have different sizes (width="1090" height="579"), but even if I change this to the original image, the image scales to a large dimension depending on my screen resolution. Isn't it possible only to scale down from the original size?

Thank you.



icc's picture


1) There is actually a restriction in the browser when embedding using an iframe that makes this impossible using just CSS. It's possible to get around it by using a JavaScript but no one has looked into implementing it yet.

2) The content will always scale to fit all of the available space, you can limit this by wrapping the embed code inside a <div style="max-width:845px"> embedcode </div>