Mobile width settings

Thsi is generated by Claude so a bit lengthy, but complete.

Divi 5 Bug Report: desktop column width overrides tablet width
Written 11 October 2026 from measurements on a live site. A column set to full width on tablet stays at its desktop width (75%) because Divi's unscoped desktop width rule wins over the tablet rule.

Environment

• Divi 5.13.1 (theme generator tag "Divi v.5.13.1")
• WordPress 7.1.3
• WP Rocket deactivated: the page source carried no WP Rocket generator tag or assets when the rules below were measured, so the cache plugin is not the cause
• Viewport: 768 x 1024 (tablet), measured client width 753px

What happens
A row has two columns: a main column and a sidebar column. The desktop layout is 3/4 + 1/4. On tablet the sidebar column is hidden (display: none) and the main column is set to full width (column structure 24/24 on tablet, and also Sizing width 100% on the tablet icon).

On a tablet-sized viewport the main column still renders at 554.391px of a 753px row, which is 73.6%, about 200px short of the right edge.

Expected
The main column fills the row (100%) at tablet width, as the tablet column structure says.

Evidence
The column's classes:

et_pb_column_4 et_pb_column et_flex_column et_flex_column_18_24 et_flex_column_24_24_tablet et_flex_column_24_24_phone
The width rules that match that element, with computed width 554.391px:

(no media query) .et_flex_column_18_24 width: calc(75% - var(--horizontal-gap-parent, 5.5%)*0.33333/1.33333)
@Media (max-width: 980px) .et_flex_column_24_24_tablet width: calc(100% - var(--horizontal-gap-parent, 5.5%)*0/1)
@Media (max-width: 767px) .et_flex_column_24_24_phone width: calc(100% - var(--horizontal-gap-parent, 5.5%)*0/1)
@Media (max-width: 980px) .et_pb_column_4 width: 100%
All four selectors have the same specificity (one class). The desktop rule .et_flex_column_18_24 is not inside a media query, so it applies at every width, and it wins at tablet width. The two tablet rules, including the one produced by the user's own Width 100% setting, lose.

All four rules came from inline <style> blocks, not from an external stylesheet.

Why it matters
Hiding a sidebar on tablet is a common setup, and the leftover gap is visible. Setting the width in the builder has no effect, so users cannot fix it without writing selectors that depend on row and column numbers.

Not tested

• Whether Divi's own static CSS file option changes the order of the rules (the setting was not varied).
• Whether it reproduces on a clean Divi 5.13.1 install with no other plugins (other plugins on the site were not disabled).
• Other desktop splits (the same pattern probably applies to any split where the desktop width class is unscoped).

Workaround
None applied on the site. Possible workaround, not used: a rule keyed on the tablet class inside a 980px media query with higher specificity, such as .et_pb_column[class*="_24_24_tablet"] { width: 100%; }.

 

Thanks. I did submit a bug report using thre chat, but thought others may be interested.