Update app.py

app.py

@@ -303,12 +303,6 @@ with gr.Blocks() as interface:
                 #         gr.Markdown("Extremely likely")
         
                 #     nps_submit = gr.Button("Submit", elem_id="nps-submit-button")
-                css = """
-                #nps-labels-row {
-                    display: flex;
-                    justify-content: space-between;
-                }
-                """
                 with gr.Group(elem_id="nps-container"):
                     gr.Markdown("### How likely are you to recommend this tool to a colleague or peer?")
                     
@@ -317,13 +311,19 @@ with gr.Blocks() as interface:
                         label="Select score:",
                         interactive=True,
                         container=False,
-                        elem_id="nps-radio-container" # Assigning elem_id for better styling if needed
+                        elem_id="nps-radio-container"
                     )
                         
-                    # Use the elem_id that the CSS is targeting
-                    with gr.Row(elem_id="nps-labels-row"):
-                        gr.Markdown("Not likely")
-                        gr.Markdown("Extremely likely")
+                    # This Row contains three elements to force the alignment
+                    with gr.Row():
+                        # 1. Left Label
+                        gr.Markdown("Not likely", scale=1)
+                        
+                        # 2. Invisible spacer that expands
+                        gr.Markdown("", scale=8) 
+                        
+                        # 3. Right Label, aligned to the right
+                        gr.Markdown("Extremely likely", scale=1, text_align="right")
                         
                     nps_submit = gr.Button("Submit", elem_id="nps-submit-button")
                     nps_output = gr.Textbox(label="", interactive=False, visible=True)