H5P Workarounds
Documentation ToolÂ
Issue: When users require magnification of 200-400%, the export and radio buttons overlap, making them hard to read.
Workaround: Add the following instruction: Please note that if this page is magnified above 200% when completing the activity below, the navigation buttons on the left and the export button may overlap. This can be done automatically by putting your H5P Documentation Tool inside a custom class like this and then adding the message globally.
In the page HTML:
<div class="documentation-tool">[your H5P shortcode]</div>
In the Web Custom Styles (this example will display the message on a pale yellow banner above the H5P):
.documentation-tool::before {
background-color: #ffe;
padding: 1em;
display: block;
font-style: italic;
text-align: center;
content: "Please note that if this page is magnified above 200% when completing the activity below, the navigation buttons on the left and the export button may overlap."
}
