Oct 15
Multiple issues with Opposite Text settings in Supreme Content Timeline module
The Opposite Text settings (under Supreme Content Timeline → Design → Opposite Text) present several issues affecting layout and styling consistency.
1) Background Color Issue
When setting a background color for the Opposite Text, the color fills the entire width of that column instead of just wrapping the text box.
This results in an oversized color block that breaks the intended visual structure of the timeline.
2) Width Setting Misalignment
When changing the width of the Opposite Text (for example, setting it to 15%), the element becomes misaligned with the timeline line.
The Opposite Text shifts position horizontally, and there’s no way to re-center or correct the alignment through the available design controls.
3) Per-Item Opposite Text Settings Not Working
When editing individual items within the timeline (Supreme Content Timeline → Select Item → Design → Opposite Text), the changes (e.g., font, color, background, etc.) do not apply.
All individual item settings are ignored, and only the global Opposite Text settings are reflected.
🧪 Steps to Reproduce
- Add a Supreme Content Timeline module.
- Add several timeline items.
- Go to Design → Opposite Text and:
--- Set a Background Color → observe it fills the entire width.
--- Change the Width (e.g., to 15%) → observe that the text becomes misaligned.
- Go to an individual item and try to adjust Opposite Text settings under Design → Opposite Text.
--- Observe that none of the individual item settings are applied.
✅ Expected Behavior
- The background color should apply only around the text content, not across the full container width.
- Width adjustments should resize the element without breaking alignment with the timeline line.
- Individual Opposite Text settings should override global settings for that specific item.
❌ Actual Behavior
- Background color fills the entire width.
- Changing width causes text to shift and misalign.
- Individual Opposite Text settings are ignored.
🧩 Environment
- Divi Supreme Pro: 5.0.0-beta.14
- Divi Theme: 5.0.0-public-alpha.24.2
- WordPress: Latest version
- Browser: Chrome
- OS: Windows
Completed
Hi David, Thanks for reporting the alignment issue when using a custom width — this will be fixed in the next beta update. Regarding the background spanning the full width, you have the option to control its width and set it to your desired value, so it doesn't span to fullwidth.