Frequently Asked Questions

Canvas sanitises every page created in the Rich Content Editor. It removes unsupported elements, rewrites structure, and inserts <p> tags to normalise spacing. This behaviour cannot be disabled. The goal is to prevent broken layouts and block unsupported or unsafe features.

Canvas strips all <script> tags and inline JavaScript for security. Only the JavaScript already built into Canvas can run. You cannot add your own JavaScript to a Canvas page.

Canvas removes elements it does not support inside course content. Examples include <button>, <form>,<input>, <dialog>,<style>, and<progress>. Where useful, this guide shows alternatives that still work in the Rich Content Editor.

Canvas removes <style>tags, external stylesheets, and most custom classes. Only inline styles and Canvas' built-in classes are allowed. The examples in this guide use inline CSS for this reason.

This is part of Canvas' HTML normalisation. The editor treats line breaks as paragraphs. To avoid unwanted spacing, you can use inline <div>elements or control spacing manually with inline margin styles.

Canvas includes its own legacy JavaScript that automatically enhances patterns such as tabs, tooltips, popovers, progress bars, draggable items, sortable lists, and resizable containers. These work because Canvas detects elements marked with enhanceable_content and upgrades them when the page loads.

You cannot create new behaviour with JavaScript, but you can use the patterns Canvas already supports.

Canvas applies its own HTML cleanup which may:

• add <p> tags around elements
• remove empty cells
• strip classes it does not recognise
• reformat whitespace

Using inline styles helps prevent unexpected formatting changes. The examples in this guide avoid any classes that are not supported by Canvas.

Canvas sanitises inline CSS and removes unsupported properties. For example, certain forms of grid shorthand, unsupported values, or vendor-specific CSS may be stripped or rewritten. Stick to widely supported properties and explicitly set values to maintain consistency.

Canvas allows CSS Grid in inline styles, but not all responsive patterns behave consistently. Items inside nested grids may not wrap as expected, and some browsers may handle auto-fit or minmax() differently. The examples in the Grid section focus on patterns that work reliably inside Canvas.

Yes. Canvas allows ARIA attributes, but it may occasionally reorder HTML or wrap elements, which can affect complex ARIA patterns. Always test ARIA-heavy content after saving.

These patterns work because Canvas enhances them with its own JavaScript. However, behaviour may vary between browsers, devices, or institutional theme settings. They should be used only for optional content, not essential instructions.

Yes. All examples in this guide are designed to be copied into a Canvas page without modification. For complex content, paste using the HTML editor to prevent the Rich Content Editor from rewriting your markup prematurely.

The easiest workflow is to write your pages using a code editor such asVisual Studio Code, keeping HTML and CSS separate while drafting. Once the layout is final, convert the CSS into inline styles and paste the finished HTML into Canvas.

It is strongly recommended that you store your files in version control (for example, Git) so you have reliable backups and can track changes over time.

Legacy components and classes are still supported, but future Canvas updates may replace or remove certain behaviours. All examples in this guide rely on the current behaviour of Canvas and avoid unsupported structures or deprecated elements.

Yes, but with caution. Anything powered by enhanceable_content is legacy and may behave differently in future updates. Use semantic HTML as your base layout, and treat any enhanced behaviour as optional.