Update app.py

app.py

@@ -21,6 +21,12 @@ css = """
     object-fit: contain; /* Preserve aspect ratio while fitting the image within the container */
 }
 
+.horizontal-examples {
+  display: flex;
+  flex-direction: row; /* Ensure items are in a row */
+  justify-content: space-between; /* Adjust spacing */
+}
+
 .face-row {
     display: flex;
     justify-content: space-around; /* Distribute space evenly between elements */
@@ -448,11 +454,11 @@ with gr.Blocks(css=css) as demo:
                         with gr.Column(scale=1):
                             compare_face_input1 = gr.Image(label="Image1", type='filepath', elem_classes="example-image")
                             gr.Examples(['examples/1.jpg', 'examples/2.jpg', 'examples/3.jpg', 'examples/4.jpg'], 
-                                        inputs=compare_face_input1)
+                                        inputs=compare_face_input1, elem_classes="horizontal-examples")
                         with gr.Column(scale=1):
                             compare_face_input2 = gr.Image(label="Image2", type='filepath', elem_classes="example-image")
                             gr.Examples(['examples/5.jpg', 'examples/6.jpg', 'examples/7.jpg', 'examples/8.jpg'], 
-                                        inputs=compare_face_input2)
+                                        inputs=compare_face_input2, elem_classes="horizontal-examples")
                             
                 with gr.Blocks():
                     with gr.Column(scale=1, min_width=400, elem_classes="block-background"):