Tip boxes being slightly cut off

Submitted by examsextra on Thu, 06/24/2021 - 17:48
Forums: 
Bugs in content types

Hi guys,

Just wondering if this has been mentioned before - tip boxes being slightly cut off at the bottom. I've noticed this from time to time in Advanced Fill the Blanks and Fill the Blanks, and on all browsers and devices. It happens before I even upload onto my LMS and page builder, so It's defintiely a H5P issue.

Wordpress Version 5.7.2

H5P Version 1.15.3

No PHP errors.

Thanks!

Attachments: 
Image icon tips.png
BV52's picture

BV52

Fri, 06/25/2021 - 18:28

Hi examsextra,

I just tested this and it looks fine for both content types. However you did mention "I've noticed this from time to time" do you have any details when exactly does this happen. Any similarities to when you notice this.

https://h5p.org/node/1187133

https://h5p.org/node/1187134

-BV

Attachments: 
Image icon FiB tip.png

examsextra

Sat, 06/26/2021 - 11:46

Hi BV

Many thanks for looking into this and running a couple of tests. To answer your question - no. It's just completely random and I've never noticed a pattern in terms of browser, device, content type, etc.

In fact, you'll see exactly what I mean in the screenshot where there are 5 separate AFtBs all displaying tips, with 2/5 being cut off. So strange! I simply cannot work it out.

Perhaps I will remake the 2 in question but I'd be amazed if that actually changes anything. Just hoping for some insight your end but it looks like it's not a known issue...

Thanks!

 

Attachments: 
Image icon Screenshot 2021-06-26 at 16.29.55.png
BV52's picture

BV52

Mon, 06/28/2021 - 18:42

Hi examsextra,

I suggest that you attach a sample content that is having the issue, so that I or someone else from the community can help you isolate the issue. I am not ruling out that this is a bug but there could be some other factors such as specific settings, length of the tip, answer or something else. 

-BV

otacke's picture

otacke

Tue, 06/29/2021 - 13:35

Hi all!

I think this is a problem in both, Fill in the Blanks and Advanced Fill in the Blanks if the tip text gets too long. You can check that by adding a (really) long hint to either of them. When you show it, the bubble will be cut off. Showing a tip text should be followed by triggering a resize in the code (you can check that manually by resizing the window once the tip is showing). Still looks a little weird, because the bubble will flow over H5P's iframe - so maybe the content's height should be increased in that case as well.

Best,
Oliver

BV52's picture

BV52

Tue, 06/29/2021 - 19:37

Hi Oliver,

You're right I just stopped after the 3rd lines since the OP's sample only had 2 lines and the issue is already showing. I was able to reproduce the issue once I got to the 4th line. I guess the resolution would be to have a scroll bar in the tip box instead of increasing the height of the content (white space at the bottom might not look good).

FYI I filed a bug report for this.

-BV

Attachments: 
Image icon FiB tip.png
otacke's picture

otacke

Tue, 06/29/2021 - 22:19

Yup, that is another option. Because I know that my UX skills are poor, I wrote "maybe" :-D Worked fine for "Pick the Symbols" though.