Sometimes, we might end up with some Sections/Rows/Modules not visible on mobile devices such as Phones and/or Tablets.
The most common reasons why a Section/Row/Module isn't visible on a Phone and/or Tablet could be:
The element in question(Section/Row/Module) is set to not show on those particular devices.
The element in question(Section/Row/Module) has a Display Condition set, which is not met.
Custom CSS or Custom JS code changes the visibility.
Definition: Element is any Section, Row or Module
Check the Element's Visibility
Open the element's Modal Settings Window
Go to Advanced Tab → Visibility
Ensure that none of the options are checked
Example of an Element that is set to not be visible on Phone:
In the above example, the Section has been set to not be Visible on the Phone by having the Phone option checked under Advanced Tab →Visiblity option
Pro Tip: Ensure that the Visual Builder is set to show the hidden elements with a lower opacity (50%). This way, any element using the Visibility option can be easily identified if it is set to not show on a particular device.
Set the Visual Builder to show hidden elements
Open any page with Visual Builder
Open the Visual Builder's settings bar
Click on the three dots icon
Ensure that the option Show Disabled Modules at 50% opacity is set to On
Check the Element's Display Conditions
Open any page with Visual Builder
Open the Element (which doesn't appear on Phone/Tablet) Modal Settings Window
Go to Advanced Tab → Conditions
Ensure there are no Display Conditions set that might prevent the Element from being visible on Tablets/Phones.
Check for any custom JS/CSS code that might change the visibility of an element
Go to WordPress Dashboard → Divi → Support Center
Enable the Safe Mode
Check again
If with the Safe Mode enabled, the Element is visible, it means that there is a piece of custom JS or CSS code that changes its default visibility.
Possible areas where custom code can be added:
For custom CSS Code:
Divi → Theme Options → General Tab → Custom CSS
Any Code module that might contain custom CSS code in the layout
Page Settings → Advanced Tab → Custom CSS
For custom JS code
Divi → Theme Option → Integration tab
Any Code Module that might contain custom JS code in the layout