diff --git a/src-web/components/RequestMethodDropdown.tsx b/src-web/components/RequestMethodDropdown.tsx
index 2c635b61..91aab2e2 100644
--- a/src-web/components/RequestMethodDropdown.tsx
+++ b/src-web/components/RequestMethodDropdown.tsx
@@ -4,6 +4,7 @@ import { RadioDropdown } from './core/RadioDropdown';
 
 type Props = {
   method: string;
+  className?: string;
   onChange: (method: string) => void;
 };
 
@@ -15,10 +16,11 @@ const methodItems = ['GET', 'PUT', 'POST', 'PATCH', 'DELETE', 'OPTIONS', 'HEAD']
 export const RequestMethodDropdown = memo(function RequestMethodDropdown({
   method,
   onChange,
+  className,
 }: Props) {
   return (
     <RadioDropdown value={method} items={methodItems} onChange={onChange}>
-      <Button type="button" size="sm" className="mx-0.5" justify="start">
+      <Button size="sm" className={className}>
         {method.toUpperCase()}
       </Button>
     </RadioDropdown>
diff --git a/src-web/components/UrlBar.tsx b/src-web/components/UrlBar.tsx
index efebe79f..06d32394 100644
--- a/src-web/components/UrlBar.tsx
+++ b/src-web/components/UrlBar.tsx
@@ -29,7 +29,7 @@ export const UrlBar = memo(function UrlBar({ id: requestId, url, method, classNa
   );
 
   return (
-    <form onSubmit={handleSubmit} className={className}>
+    <form onSubmit={handleSubmit} className={classnames('url-bar', className)}>
       <Input
         key={requestId}
         hideLabel
@@ -42,7 +42,9 @@ export const UrlBar = memo(function UrlBar({ id: requestId, url, method, classNa
         onChange={handleUrlChange}
         defaultValue={url}
         placeholder="Enter a URL..."
-        leftSlot={<RequestMethodDropdown method={method} onChange={handleMethodChange} />}
+        leftSlot={
+          <RequestMethodDropdown method={method} onChange={handleMethodChange} className="mx-0.5" />
+        }
         rightSlot={
           <IconButton
             title="Send Request"
diff --git a/src-web/components/core/Input.tsx b/src-web/components/core/Input.tsx
index 0515f428..9012ab3b 100644
--- a/src-web/components/core/Input.tsx
+++ b/src-web/components/core/Input.tsx
@@ -47,8 +47,9 @@ export function Input({
   const inputClassName = classnames(
     className,
     '!bg-transparent min-w-0 h-full w-full focus:outline-none placeholder:text-placeholder',
-    !!leftSlot && '!pl-0.5',
-    !!rightSlot && '!pr-0.5',
+    // Bump things over if the slots are occupied
+    leftSlot && 'pl-0.5 -ml-2',
+    rightSlot && 'pr-0.5 -mr-2',
   );
 
   const isValid = useMemo(() => {