Issue with chrome browser fixed

Author: psriraj3

src/index.css

@@ -450,13 +450,32 @@ h1 { margin: 0; font-size: 22px; }
 }
 .siteMain { min-width: 0; }
 
-.adRail {
-  position: relative;
+/* ad rails sit in the gutters but do NOT “reserve” fixed 300px columns */
+.adRail{
+  position: sticky;
+  top: 16px;
   align-self: start;
-  display: flex;
-  justify-content: center;
+  width: 300px;
+  max-width: 300px;
+  height: auto;
+  min-height: 260px;
+  opacity: 0.9;
 }
 
+/* left rail hugs the center; right rail hugs the center */
+.siteGrid > .adRail:first-child{ grid-column: 1; justify-self: end; }
+.siteGrid > .adRail:last-child{  grid-column: 3; justify-self: start; }
+
+/* Hide rails when screen isn’t wide enough for (app + 2 rails) */
+@media (max-width: 1580px){
+  .siteGrid{ grid-template-columns: 1fr; padding: 18px 12px 52px; }
+  .siteMain{ grid-column: 1; }
+  .adRail{ display: none; }
+}
+
+/* Prevent accidental horizontal scroll that makes things look “stuck left” */
+html, body{ overflow-x: clip; }
+
 .adBox { width: 300px; min-height: 600px; }
 
 .adFrame {
@@ -657,4 +676,56 @@ html:-webkit-full-screen .mobileAds,
     padding: 7px 9px;
     font-size: 12px;
   }
+}
+
+/* ===========================================
+   Chrome layout hardening / centering fix
+   Paste at the VERY END of index.css
+   =========================================== */
+
+html, body {
+  width: 100%;
+  overflow-x: hidden;
+}
+
+/* --- Layout: always-center main column, show ad rails only when there’s room --- */
+.siteGrid{
+  display: grid;
+  /* side gutters are flexible; center column is your app width */
+  grid-template-columns: minmax(0, 1fr) minmax(0, var(--app-max)) minmax(0, 1fr);
+  gap: 18px;
+  padding: 28px 18px 64px;
+  align-items: start;
+}
+
+/* center column always centered */
+.siteMain{
+  grid-column: 2;
+  width: min(100%, var(--app-max));
+  justify-self: center;
+}
+
+/* The actual app container should always center */
+.siteMain > .container {
+  width: 100%;
+  max-width: var(--app-max);
+  margin-left: auto;
+  margin-right: auto;
+}
+
+/* When ads collapse (single column), still center everything */
+@media (max-width: 1200px) {
+  .siteGrid {
+    grid-template-columns: 1fr !important;
+    justify-content: stretch !important;
+  }
+
+  .siteMain {
+    justify-content: center;
+  }
+
+  .siteMain > .container {
+    padding-left: var(--pad);
+    padding-right: var(--pad);
+  }
 }