Reduce Protect Form Width While Keeping Protect Section Full Width

Preview.

In this example, we will be showing you how to customize the width of your Divi Protect Form while keeping the Protect Section full width (or any other width).

Description.

How to customize the width of a Divi Protect Form and Protect Section.

Difficulty.

Easy.

Time.

15 Minutes.

Setting It Up - Protect Section.

  1. Head over to Divi Engine > Protect Section and create a new Section. 

  2. Add a title, Section, Row, Module and password.

Row Settings.

Width & Max-Width:
100%.

  1. Add title.
  2. Add Section.
  3. Add Row.
  4. Add Module (your content).
  5. Adjust the width to 100% (or another width).
  6. Add a password.

Customising Our Settings - Divi Protect.

Customize the rest of your Protect Form using our documentation.

Custom Code.

Add the following CSS to the Divi Theme Options (or your child theme). This CSS will adjust the spacing of your Protect Form.

CSS.

Width & Max-Width:
1080 px (of your own).

  1. Add CSS Code.
  2. Save.

Now view your Divi Protect Form and Section from the frontend.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us