Re-sizing

Submitted by EMMY17 on Thu, 02/25/2016 - 20:41
Forums: 
Content creation

Hello,

Is there any way to control for size? On my iphone, h5p content sizes itself perfectly, but on both of my laptops many of the h5ps (course content, drag and drop, quizzes, etc) display too large. You can't see the whole h5p on the screen at one time, and you have to scroll up and down between questions, etc and the controls at the bottom. I can't seem to figure out how to stop this from happening. Any suggestions?

Thank you!

 

falcon's picture

falcon

Fri, 02/26/2016 - 15:07

H5P uses the full width of its container so if your site has unlimited width for the content you need to limit it for H5P somehow. If I want an H5P to be narrower on a site that doesn't have any nice way of controlling it I often add <div style="max-width:600px:">H5P tag here</div> for instance.

EMMY17

Tue, 03/01/2016 - 19:21

Just to make sure I understand, I add that to my css file? And what do I put for the H5P tag? 

Thanks!

falcon's picture

falcon

Tue, 03/01/2016 - 20:34

It is added to the HTML around the H5P tag.

EMMY17

Wed, 03/02/2016 - 00:11

I'll give it a try.

Claire Dervout

Mon, 03/07/2016 - 00:11

Hi,

I have the same issue. How did you go, did it work for you?

Thanks

Claire

EMMY17

Mon, 03/07/2016 - 05:22

but I will let you know when I get it figured out ;) If you do it first, please keep me posted too! I'm new to all this stuff. 

Thx 

falcon's picture

falcon

Mon, 03/07/2016 - 14:58

To be clear if you have an H5P with id 123 this should work:

For drupal (replace - with =):
<div style="max-width:600px;">[h5p-123]</div>

For Wordpress:
<div style="max-width:600px;">[h5p id="123"]</div>

EMMY17

Mon, 03/07/2016 - 19:51

I will try this today :)

Transpro

Wed, 03/01/2017 - 08:13

Hi,

I am using h5p in wordpress, I have uploaded the h5p files , and used them using wordpress plugins.

In most of the h5p files, the vertical scroll bar on right side in browser is missing.

How do I resolve this problem. Please help

Thanks,

Saroja

tim's picture

tim

Wed, 03/01/2017 - 08:43

Hi Saroja, would you be able to attach some screenshots of where the scrollbar is missing?

Transpro

Thu, 03/02/2017 - 08:30

Please find the screenshot attached.

The vertical slider on browser right side is not shown initially, when h5p content is there on the page.

The vertical slider is however shown for non h5p content.

Thanks, 

Saroja

 

Attachments: 
Image icon screenshoth5p.png
fnoks's picture

fnoks

Thu, 03/02/2017 - 09:25

I think this is caused by your theme, maybe an overflow: hidden in one of the parent DOM-elements?