Column and Accordion Content Cut-Off on Chrome

 

The bottom of H5P content embedded in LearnDash lessons on WordPress site is recently cutting off at the bottom on Google Chrome browsers in the H5P plugin page and embedded content pages. Accordion text that is really long is also cut-off at the bottom.

  1. Detailed steps to reproduce the bug (exactly how and when did it happen): Noticed recently on Google Chrome desktop browser - may have coincided with recent Google Chrome update.
  2. Platform and version number. E.g. Drupal, Wordpress, Moodle: WordPress 6.1.1; LearnDash LMS 4.4.1.2
  3. Mobile or Desktop: Desktop only
  4. Browser: Chrome, Firefox, Safari etc: Google Chrome 109.0.5414.75
  5. H5P plugin version: Version 1.15.6
  6. H5P content type and version (if a content type was used), and a sample URL or attached H5P. Accordion 1.0.30; Column 1.13.1; See attached test accordion content. Paragraph of text below "What do we do with this information?" is cut-off. Column example not attached, but see screenshots below.
  7. Any browser console errors: No
  8. Any PHP errorsUnknown
  9. Screenshots if it's a visual problem: See below for Column example.
  10. Any recent changes to the environment (new plugins/modules, updates, configuration changes etc.): No
  11. Any recent changes to the browser you're using (new extensions, updates etc.): Chrome update recently

 

Example 1: Accordion Content

In editing page

 

Created Accordion Content (bottom paragraph cut-off)

 

Example 2: Column Content

Google Chrome (Column: content under "schedule a training time" is cut-off and jumps straight to navigation buttons)

 

Microsoft Edge (Column content and text visible)

Content types: 
otacke's picture

Hi!

 

Your content seems to be working nicely here (on Chrome). Are you sure there are no error messages on the browser's development console? Could you please post a screenshot?

 

Best,

Oliver

Thank you for your response, Oliver. I did some testing on a second laptop with the same version of the Chrome browser and it worked on that device, so maybe it has something to do with the size of the page on the first laptop. Because I was also able to see the full text via your link on device 1. Both devices have the same OS, chrome version, and chrome profile/extensions, but a different screen-size. The page where the content is embedded also shows the same errors on both devices, with only the second laptop showing the full text.
otacke's picture

So there were error messages. Not sure if they are rhe cause here.

You say you're embedding content. How do you do that? Is the resize script included?

Best,

Oliver 

Yes, the error messages appear to be the same on both devices but the cut-off only happens on one. Embed is the wrong word, I input the h5p content shortcode in our LearnDash LMS lesson pages using the "Add H5P" button via the WordPress plugin. I do not use an iframe or other embed tool.

otacke's picture

That's rather odd then. Is there some link to the page that you could share?

Thank you for sharing.