override default 100% width if needed
Hello,
I am using H5P within my WPLMS learning management system (a Wordpress-based LMS). Yesterday I started building a branching scenario with hotspot images (and other content). I noticed that the images are always displayed full page width, even if the original image is much smaller. In the CSS-file I found that .h5p-content-wrap is set to width:100% by default. Thus, a small image is blown up to a huge size on a larger screen (and looks awfully blurry). You can get an impression here.
Normally, I would just use a container around the H5P content to limit it's size. But WPLMS works with a frontend course builder and accessing the code editor for a unit is doable, but cumbersome. Especially if one needs to do it frequently.
I am not good enough in CSS to write some custom CSS to fix this for all images, slide decks and other content based on images and slide decks which have the same issue.
I would be great to have an option in H5P to set the maximum display width and height of a image or slide deck to the original image size. Else, I would be grateful for the custom CSS I could use.
Thanks,
Wiebke