Resizing of Drag and Drop Activity

twc57's picture

Hi... I'm on a 2015 Mac book Pro. The Chrome Browser version is: 81.0.4044.129 (Official Build) (64-bit). The H5P plug-in version in Wordpress(5.4.1) is: 1.15.0. Everything with content creation content is fine. My problem is that after I publish the activity, it appears very large in the resulting browser window in both Chrome and Safari. I think I might be missing something. I am including a screen capture video of the problem which I hope helps. Thank you.

Content types: 
otacke's picture

Hi twc57!

The setting in Drag and Drop is a little misleading. It's not the resulting size when viewing the content, but the internal dimensions for sizing and positioning when creating the dropzones, etc.

By default, any H5P content type will use the full width that's available given by the host system. In your theme's stylesheet - or whatever it might be called depending on your host system, you could limit the width of the h5p-iframe-wrapper element by something like

.h5p-iframe-wrapper { width: 300px; }

or something similar. However, this will be then be used for all content types. There's a slightly more complicated way described in the customization documentation ( called alter_styles hook. This one would allow to at least restrict those changes to Drag and Drop only.

Beyond that, there's no good way. The H5P core team is aware of this problem, and you can track progress of a solution at, but I don't think this is a high priority issue right now.