Reduce Protect Form Width While Keeping Protect Section Full Width

Written by the Divi Engine Documentation Team

Introduction

Follow these steps to customize the width of your Divi Protect Form while keeping the protect section full width (or any other width).

Preview

Description

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

Difficulty

Easy.

Time

15 Minutes.

Step 1: Set 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.

Step 2: Customize Our Settings - Divi Protect

Customize the rest of your Protect Form using our documentation.

Step 3: Add 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.

More Support?

Please email us at [email protected] if you are unable to get Divi Protect working.

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