DesignPLUS limits the page width to 1100px, by default. The page width limitation can be overridden for designs built to work on larger page widths.
To allow the page content to grow beyond 1100px, add the class dp-full-width-content to any element on the page or add data-dp-fullwidth="true" to the dp-wrapper div.
To add this class using the Attributes tool,
Edit the page and open the sidebar- Go to the Advanced tools and open the Attributes tool
- If needed, first go to the User Settings and enable this advanced tool
- In the Attributes tool, select the Page div
- Typically, the div to the very far left of the target element list
- In the class textarea, add the class dp-full-width-content
- Save the page
- When the page loads, it will take up the full width of the screen
This is currently a Hidden Gem in the DesignPLUS sidebar. For more Hidden Gems, see the DesignPLUS User Guide: Hidden Gems.
Usability Notice
1100 pixels is set as default because usability is not met when content fills the full width of a large screen. The optimal line length for reaching comprehension is 50-75 characters.
Cidi Labs does not recommend making the page width greater than 1100 pixels default at the institutional level for usability purposes. We added the ability to make the content fill the width for designs built to work on larger widths.
For more information on the difference between the page widths and why Canvas does not limit the page width, see this Knowledge Base Article: Why does my DesignPLUS content not span the full width of the screen?