Update app.py

app.py

@@ -50,6 +50,16 @@ st.markdown(
         border-radius: 10px;
         padding: 5px;
     }
+    .info-box {
+        display: inline-block;
+        background-color:#FFB6C1;
+        border: 2px solid black;
+        border-radius: 8px;
+        padding: 5px;
+        margin: 5px;
+        text-align: center;
+        width: auto;
+    }
     </style>
     """,
     unsafe_allow_html=True,
@@ -173,24 +183,13 @@ with col2:
     except Exception as e:
         st.error(f"⚠️ Error in visualization: {str(e)}")
 
-col5, col6, col7 = st.columns(3)
-
-# Custom HTML/CSS for iteration and current point display with pink background and black borders
-col5.markdown(
+st.markdown(
     f"""
-    <div style="background-color:#FFB6C1; border: 2px solid black; border-radius: 8px; padding: 4px;">
-        <span style="color:black; font-weight: bold;">🧑‍💻 Iteration:</span> <br> 
-        <span style="color:black;">{st.session_state.iteration}</span>
+    <div class="info-box">
+        🧑‍💻 Iteration: {st.session_state.iteration}
     </div>
-    """,
-    unsafe_allow_html=True,
-)
-
-col7.markdown(
-    f"""
-    <div style="background-color:#FFB6C1; border: 2px solid black; border-radius: 8px; padding: 4px;">
-        <span style="color:black; font-weight: bold;">📍 Current Point:</span> <br> 
-        <span style="color:black;">({st.session_state.x:.4f}, {st.session_state.y_vals[-1]:.4f})</span>
+    <div class="info-box">
+        📍 Current Point: ({st.session_state.x:.4f}, {st.session_state.y_vals[-1]:.4f})
     </div>
     """,
     unsafe_allow_html=True,