# elementor/4.0.0-dev4/modules/atomic-widgets/elements/atomic-tabs/atomic-tab/atomic-tab.html.twig

Elementor Website Builder – more than just a page builder, version 4.0.0-dev4. 3 lines.

- Page: https://pluginprobe.com/plugins/elementor/4.0.0-dev4/code/modules/atomic-widgets/elements/atomic-tabs/atomic-tab/atomic-tab.html.twig
- Raw: https://pluginprobe.com/plugins/elementor/4.0.0-dev4/raw/modules/atomic-widgets/elements/atomic-tabs/atomic-tab/atomic-tab.html.twig
- Modified: 2026-03-25T16:12:18+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/elementor/4.0.0-dev4/code/modules/atomic-widgets/elements/atomic-tabs/atomic-tab/atomic-tab.html.twig#L10-L20`.

```twig
{% set classes = ['e-con', 'e-atomic-element', base_styles.base] | merge(settings.classes | default([])) | join(' ') %}
<button class="{{ classes }} {{ editor_classes | default('') }}{{ is_active ? ' e--selected' : '' }}" data-id="{{ id }}" data-element_type="{{ type }}" data-e-type="{{ type }}" data-interaction-id="{{ interaction_id }}" data-interactions="{{ interactions | json_encode | e('html_attr') }}" role="tab" tabindex="{{ is_active ? '0' : '-1' }}" aria-selected="{{ is_active ? 'true' : 'false' }}" x-bind="tab" x-ref="{{ id }}" id="{{ tab_id }}" aria-controls="{{ tab_content_id }}" {{ editor_attributes | default('') | raw }}><!-- elementor-children-placeholder --></button>

```