diff --git a/extensions/odoo_theme/layout.html b/extensions/odoo_theme/layout.html
index 86930dbea..9c869b7a5 100644
--- a/extensions/odoo_theme/layout.html
+++ b/extensions/odoo_theme/layout.html
@@ -79,7 +79,7 @@
             {% set main_classes = main_classes + ['doc-toc'] %}  {# TODO EDI do you use this ?#}
         {% endif %}
 
-        <main class="{{ ' '.join(main_classes) }}">
+        <main class="container-fluid {{ ' '.join(main_classes) }}">
             <div id="o_content">
                 {% if pagename == master_doc %}
                     {# Custom landing page on the root of the documentation #}
diff --git a/extensions/odoo_theme/static/scss/_variables.scss b/extensions/odoo_theme/static/scss/_variables.scss
index 46e098691..c86788d7d 100644
--- a/extensions/odoo_theme/static/scss/_variables.scss
+++ b/extensions/odoo_theme/static/scss/_variables.scss
@@ -240,6 +240,10 @@ $o-side-nav-width:                          350px;
 $o-on-page-width:                           25%;
 $o-header-white:                            #ffffff;
 
+// has_code_col pages
+$o-halfpage-width:                          54%;
+$o-codecol-width:                           43%;
+
 // Paths and Prefixes
 $website-img-base-url:                      "../img/";
 $website-2x-prefix:                         "2x_";
diff --git a/extensions/odoo_theme/static/style.scss b/extensions/odoo_theme/static/style.scss
index 59ed14f75..ee027735a 100644
--- a/extensions/odoo_theme/static/style.scss
+++ b/extensions/odoo_theme/static/style.scss
@@ -286,12 +286,12 @@ header.o_main_header{
 
 #wrap {
     margin-top: $o-header-height;
-    display: flex;
-    justify-content: space-between;
-    padding: 0 1rem;
 
     @include media-breakpoint-up(lg) {
-        padding: 0;
+        display: flex;
+        justify-content: space-between;
+    }
+
     code {
         display: inline-block;
         color: inherit;
@@ -301,6 +301,9 @@ header.o_main_header{
         border: 1px solid $gray-light;
         overflow-wrap: anywhere;
     }
+
+    iframe {
+        max-width: 100%;
     }
 
     main {
@@ -309,13 +312,14 @@ header.o_main_header{
 
         @include media-breakpoint-up(lg) {
             left: $o-side-nav-width;
-            width: calc(100vw - #{$o-side-nav-width} - #{$o-on-page-width});
+            max-width: calc(100vw - (#{$o-side-nav-width} + var(--bs-gutter-x, 1.5rem)) - #{$o-on-page-width});
             padding: 3rem;
+            margin: 0;
         }
 
         &.index, &.doc-toc, &.has_code_col {
             @include media-breakpoint-up(lg) {
-                width: calc(100vw - #{$o-side-nav-width} );
+                max-width: calc(100vw - (#{$o-side-nav-width} + var(--bs-gutter-x, 1.5rem)) );
             }
         }
 
@@ -401,20 +405,10 @@ header.o_main_header{
         &.has_code_col {
 
             article.doc-body {
-                padding-left: 1rem;
-                padding-right: 1rem;
-
                 > *{
                   max-width: 100%;
                 }
 
-                section {
-                    position: relative;
-                    display:block;
-                    float: left;
-                    width: 100%;
-                }
-
                 @include media-breakpoint-up(lg) {
                     width: 100%;
                     padding-right: 0;
@@ -426,20 +420,18 @@ header.o_main_header{
 
 
                     .o_git_link {
-                        top: .5rem;
-                        right: calc(43% + 1rem);
+                        right: calc(#{$o-codecol-width} + 2rem);
                     }
                     section {
 
                         > * {
-                            width: 54.633333%;
-                            /* max-width: 600px; */
+                            width: $o-halfpage-width;
                             float: left;
                             clear: left;
                         }
 
                         > h1 {
-                            max-width: calc(54% - 120px);
+                            max-width: calc(#{$o-halfpage-width} - 120px);
                         }
 
                         > h1, > h2, > h3, > h4, > h5, > h6 {
@@ -448,7 +440,7 @@ header.o_main_header{
                         }
 
                         .doc-aside {
-                            width: 43%;
+                            width: $o-codecol-width;
                             float: none;
                             clear: none;
                             margin-left: 57%;
@@ -514,9 +506,12 @@ header.o_main_header{
 
                 ul {
                     list-style: none;
-                }
-            }
+                    padding-left: 0;
 
+                    li {
+                        padding-bottom: .5rem;
+                    }
+                }
             }
 
             /* dt {