← ClaudeAtlas

divi-5-compatibilitylisted

Use this skill when validating CSS for Divi 5 / Divi 5.6 compatibility, checking unsupported features or units, troubleshooting Divi CSS that isn't applying, debugging plugin conflicts (WP Rocket, LiteSpeed, Wordfence, WooCommerce, Perfmatters), migrating from Divi 4 to Divi 5, understanding breakpoints, applying the 5.5 Aspect Ratio + Framing settings to prevent CLS, using the 5.3 pseudo-class editing modes (:checked / :focus / :active) instead of custom CSS, the 5.4 Sizing Variable Generator and Relative Colorscheme Generator, the 5.6 new modules (Timeline, Breadcrumbs, SVG, Table of Contents, Instagram Feed), Nested Option Presets, Critical CSS / Dynamic CSS / Inline Stylesheets, or fixing "styles not working" / "button override not working" / "static CSS cache" issues. Provides compatibility rules, validation patterns, specificity fixes, composable settings alternatives, version-specific bug fix history, and a full error-message reference.
cjsimon2/Divi5-ToolKit · ★ 38 · Code & Development · score 76
Install: claude install-skill cjsimon2/Divi5-ToolKit
# Divi 5 Compatibility Reference **Divi 5 Version:** 5.6.0 (May 25, 2026 — Divi 5.0 released February 26, 2026) **Architecture:** React 18, no Shadow DOM, standard DOM with `et_pb_*` classes **Key recent additions:** - 5.2 — Composable Settings (toggle any design option on any sub-element) - 5.3 — Pseudo-class editing (`:checked`, `:focus`, `:active`), Contact Form 7 Styler, Nested Option Presets - 5.4 — Sizing Variable Generator, Relative Colorscheme Generator - 5.5 — Aspect Ratio + Framing on all images, Image Presets, SVG sanitization - 5.6 — Five new modules (Timeline, Breadcrumbs, SVG, Table of Contents, Instagram Feed), Color Scale + Color Harmony Generators ## CSS Feature Support ### Unit Picker Dropdown (Builder Fields) | Unit | Status | Notes | |------|--------|-------| | `px` | Supported | Standard absolute unit | | `%` | Supported | Percentage | | `em` | Supported | Relative to parent font | | `rem` | Supported | Relative to root font | | `vw` | Supported | Viewport width | | `vh` | Supported | Viewport height | | `in`, `mm`, `cm`, `pt`, `pc` | Supported | Print/absolute units | ### Advanced Units (Freeform/Advanced Input Mode) All valid CSS units work in advanced input mode and in custom CSS fields: | Unit | Status | Notes | |------|--------|-------| | `ch` | Works in custom CSS | Not in dropdown; works in freeform/advanced/child theme | | `ex` | Works in custom CSS | Not in dropdown; works in freeform/advanced/child theme | | `dvh`, `svh`, `lvh` | Works in