Make full width all Betterdocs single pages

Are you currently using the Betterdocs plugin on your WordPress website? If you are facing issues with Betterdocs page width this article will help you.

Actually, this width issue is happening due to the conflict with the theme you are using. However, you can try the following CSS code to resolve the issue.

.betterdocs-wraper.betterdocs-main-wraper {
  width: 150% !important;

Didn’t work this CSS code for you?

Here you can try new code to add your custom CSS section. Most probably this code will work for you.

.betterdocs-single-wraper.betterdocs-single-bg.betterdocs-single-layout1 {
  width: 148% !important;

@media (max-width: 480px){
.betterdocs-single-wraper.betterdocs-single-bg.betterdocs-single-layout1 {
  width: 100% !important;


@media only screen and (max-width: 767px){

.betterdocs-single-wraper .betterdocs-content-area .docs-single-main {

width: 103% !important;


How to Add custom CSS?

Navigate to your WordPress Dashboard -> Appearance -> Customize. Then search for ‘Additional CSS’ option and you will be able to add your own CSS code there.

-> Appearance
-> Customize
-> Additional CSS’ 

Are you using Elementor Pro?

Add Custom CSS Elementor Element: Edit the widget you want to customize and then switch to the ‘Advanced’ tab. Then, you can simply write or paste the CSS code.

-> Select Widget
-> Open Advance Tab
-> Scroll down and find the Custom CSS option

Leave a Reply

Your email address will not be published. Required fields are marked *

SWS – UK Seasonal Working Visa Apply Adsense Approval Niches and Eligibility checker 11 Best free AI copywriting tools Free Web Hosting and Cheapest Domain Registration