How to check HTML is properly closed
When adding HTML inside EE Builder modules the page can become broken when HTML tags are opened but not closed properly. This is a common issue that can lead to broken layouts and dysfunctional modules.
đź‘Ž Incorrect approach: When wrapping text or using HTML within a module you will always have an opening tag (eg. <strong>) and a closing tag (eg. </strong>). Users will sometimes use an opening tag without a closing tag or try to close the code with an additional opening tag.
Another issue, which is just unnecessary code, is repeating the opening tag with its attributes when closing it.
Example of double opening tag: <strong>Here’s my bolded text<strong>
Example of no closing tag: <strong>Here’s my bolded text
Example of repeating attributes in closing: <strong style=”color:red;”>Here’s my red bolded text</strong style=”color:red;”>
đź‘Ť Correct approach: Always ensure that any code is wrapped with an opening and closing tag. A closing tag will always begin with '</' and never be identical to the opening tag. *
Example of double opening tag: <strong>Here’s my bolded text</strong>
Example of no closing tag: <strong>Here’s my bolded text</strong>
Example of repeating attributes in closing: <strong style=”color:red;”>Here’s my red bolded text</strong>
*Note: Some HTML elements like <img> , <br> , and <hr> are self-closing and don't require a separate closing tag, but most elements used in EE Builder modules (like <strong> , <div> , <span> , etc.) do require proper opening and closing tags.
Have issues on your page? Use our HTML checker here.