The background color displays differently on different computers

[nvliajia]

Describe the bug

hi,I encountered the following problem： My webpage runs the same on different computers, but only one laptop has a different colored background。 This is normal：

This is abnormal： ![Uploading 7b6bf954b0436c883538c71e895324c5.png…]()

how should I do？

Have you searched existing issues? 🔎

• [X] I have searched and found no existing issues

Reproduction

import gradio as gr
CSS = r"""
.duplicate-button {
  margin: auto !important;
  color: white !important;
  background: black !important;
  border-radius: 100vh !important;
}

.modal-box {
  position: fixed !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* center horizontally */
  max-width: 1000px;
  max-height: 750px;
  overflow-y: auto;
  background-color: var(--input-background-fill);
  flex-wrap: nowrap !important;
  border: 2px solid black !important;
  z-index: 1000;
  padding: 10px;
}

.dark .modal-box {
  border: 2px solid white !important;
}

h1 {
    text-align: center;
    display:block;
    font-size:60px;
    color:black;
}

.id1 {
border: 0px solid black !important;
background-color:white;
}

#id1 {
border: 0px solid black !important;}

#id2 {
border: 0px solid black !important;
max-width: 160px;
}

#id3 {
border-color:blue;
}

#chatbot1 .user {
    background-color:cyan;
}
#chatbot1 .bot {
    background-color:white;
}

footer{display:none !important}
"""

with gr.Blocks(title="LlAma3", css=CSS) as demo:
    with gr.Column(visible=True) as chat_box:
        messages = gr.State([])

        chatbot = gr.Chatbot(show_copy_button=False,avatar_images=['user2.jpg','bot3.jpg']
            ,bubble_full_width=False,show_label=False,elem_id='chatbot1',value=[(None, "我是你的AI助手，让我们开始聊天吧！！")],height=600,elem_classes='id1')
        clear_btn = gr.Button(elem_id='id2',value='清除历史')

        with gr.Group():
            with gr.Row():
                with gr.Column(scale=10):
                    query = gr.Textbox(show_label=False,placeholder='请输入...',container=False,elem_id='id3')
                with gr.Column(scale=1):
                      submit_btn = gr.Button(elem_id='id3')
demo.launch(share=True)

Screenshot

No response

Logs

No response

System Info

The computer with the exception is the Win11 system and Google Chrome browser。

Severity

I can work around it

[nvliajia]

This is normal：

this is abnormal:

[pngwn]

Is this locally? Are they both using the same version of gradio?

[nvliajia]

yes，the same version of gradio==4.29.0

[pngwn]

Could you upgrade to 4.31.5 to see if this issue is still present?

[abidlabs]

Going to close for lack of follow up but we can reopen if this is still an issue

[nvliajia]

Sorry for replying so late,I have upgraded to 4.31.5,but there are still issues

[nvliajia]

oh,sorry,my colleague told me that it was because he changed the theme color of the computer system to black.