Почему фоновые коды не работают на странице чата в полноэкранном режиме?

Всем привет.
Почему код, который работает на главной странице, не работает на фоне чата?


Сейчас отображение некорректное, когда чат находится в полноэкранном режиме.

Мой код для фона и body:

body {
  background-color: #1a1a2b;
}

body:before {
  display: inline-block;
  border-radius: 10px;
  width: 1125px;
  height: inherit;
  background-color: #26263B;
  content: " ";
  position: absolute;
  left: 50%;
  right: 0;
  top: 72px;
  bottom: 11px;
  transform: translate(-50%, 0);
  box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.3);  
}

body {
  position: relative;
}
body {
  background-image: url("https://pvpfarm.com/uploads/default/original/1X/1b5dd68a865855193164193f21e08630a3ed6da6.png");
  background-size: 240px;
  background-repeat: repeat;
  background-attachment: local;
}

Не хочу засорять эту тему, но кто-нибудь может помочь?
Я пробовал много способов, но ничего не работает.

Я хотел посмотреть ваш сайт, но чат, похоже, отключен для меня.

Я протестировал локально, и ваш CSS, кажется, работает нормально.

Возможно, какой-то другой CSS-код переопределяет ваш фон или мешает его корректному отображению.

Я посмотрел, но не смог заставить этот путь к изображению работать корректно. Вместо этого загрузите изображение в папку assets вашей темы, а затем в CSS используйте переменную:

background-image: url($image_variable_name);

где image_variable_name — это имя, которое вы зададите при загрузке.

Спасибо, что потратили своё драгоценное время на решение моей проблемы. @Arkshine @Lilly
Я повысил ваш уровень участника до 2. Теперь вы можете войти в чат.

Да, несколько фрагментов CSS-кода вызывали проблемы.
Я их исправил, но теперь в нижней части области чата появился отступ.

Кроме того, свойство bottom в селекторе body:before не работает.
Сейчас я не могу это исправить.

@Lilly, если я правильно понял ваше сообщение, я загрузил изображение именно так:

Ekran görüntüsü 2024-06-04 085453

Кстати, я создал этот дизайн, не имея никаких знаний в CSS. Поэтому я, возможно, допускаю много ошибок. Благодаря вам я учусь на своих ошибках. :pray:

.has-full-page-chat:not(.discourse-sidebar) #main-outlet {
  height: auto;
  position: absolute;
  left: 50%;
  right: 0;
  top: auto;
  bottom: auto;
  transform: translate(-50%, 0);
  box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.3);
}

Я в настоящее время использую этот код, и он работает.
Поправьте меня, если я ошибаюсь. Спасибо.