---
title: UnclosedHTMLElement
description: Identifies instances of unclosed HTML elements in branching code.
source_url:
  html: >-
    https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/unclosed-html-element
  md: >-
    https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/unclosed-html-element.md
---

# UnclosedHTMLElement

***

## Examples

The following examples contain code snippets that either fail or pass this check.

### ✗ Fail

```liquid
<!-- Dangling open/close must be in conditional branches of the same parent -->
<div>
  {% if cond %}
    <details>
  {% endif %}
  <p>
    {% if cond %}
      </details>
    {% endif %}
  </p>
</div>


<!-- They must open/close in the same condition -->
<div>
  {% if something %}
    <details>
  {% endif %}


  {% if something_else %}
    </details>
  {% endif %}
</div>


<!-- They must open/close in the correct order -->
<div>
  {% if cond %}
    <details
      <summary>
  {% endif %}


  {% if cond %}
    </details>
    </summary>
  {% endif %}
</div>
```

### ✓ Pass

```liquid
<!-- They must open/close in the same condition -->
<div>
  {% if something %}
    <details>
  {% endif %}


  {% if something %}
    </details>
  {% endif %}
</div>


<!-- They must open/close in the correct order -->
<div>
  {% if cond %}
    <details>
      <summary>
  {% endif %}


  {% if cond %}
      </summary>
    </details>
  {% endif %}
</div>


<!-- `else` and `unless` evaluate to the negated condition identifier -->
<div>
  {% if cond %}
  {% else %}
    <details>
  {% endif %}


  {% unless cond %}
    </details>
  {% endunless %}
</div>
```

***

## Options

```yaml
UnclosedHTMLElement:
enabled: true
severity: warning
```

| Parameter | Description |
| - | - |
| `enabled` | Whether this check is enabled. |
| `severity` | The [severity](https://shopify.dev/themes/tools/theme-check/configuration#check-severity) of the check. |

***

## Disabling this check

Disabling this check isn't recommended.

***