diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 162d070..9992d66 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -17,7 +17,7 @@
                     v-for="(endpointData, index) in endpointsData"
                     :key="index"
                 >
-                    <summary class="collapse-title flex gap-4">
+                    <summary class="collapse-title flex flex-wrap gap-2 sm:gap-4">
                         <span class="font-semibold">{{ endpointData.endpoint }}</span>
                         <span v-if="endpointData.details?.Domain && endpointData.details.Domain.Address">
                             ({{ endpointData.details.Domain.Address }})
diff --git a/frontend/src/components/EndpointCard.vue b/frontend/src/components/EndpointCard.vue
index 942f043..597a66c 100644
--- a/frontend/src/components/EndpointCard.vue
+++ b/frontend/src/components/EndpointCard.vue
@@ -1,7 +1,7 @@
 <template>
     <div>
         <div v-if="ssl">
-            <div class="flex gap-4">
+            <div class="flex flex-wrap gap-4">
                 <p><strong>TLS Version:</strong> {{ ssl.Version }}</p>
                 <p>
                     <strong>Handshake Complete:</strong>
diff --git a/frontend/src/components/EndpointCertificateCard.vue b/frontend/src/components/EndpointCertificateCard.vue
index 3121bec..a7dfb3d 100644
--- a/frontend/src/components/EndpointCertificateCard.vue
+++ b/frontend/src/components/EndpointCertificateCard.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <div class="flex gap-10 mb-2 items-center">
+        <div class="flex flex-col sm:flex-row gap-4 mb-2 items-start sm:items-center">
             <ExpiryCountdown :validTo="certificate.NotAfter" />
 
             <div>
@@ -12,7 +12,7 @@
         <p><strong>Subject:</strong> {{ certificate.Subject }}</p>
         <p><strong>Issuer:</strong> {{ certificate.Issuer }}</p>
 
-        <div class="mt-2 flex gap-5">
+        <div class="mt-2 flex flex-wrap gap-4">
             <p><strong>Signature Algorithm:</strong> {{ certificate.SignatureAlgorithm }}</p>
             <p><strong>Public Key Algorithm:</strong> {{ certificate.PublicKeyAlgorithm }}</p>
         </div>
diff --git a/frontend/src/components/WhoIs.vue b/frontend/src/components/WhoIs.vue
index 05497ae..501b070 100644
--- a/frontend/src/components/WhoIs.vue
+++ b/frontend/src/components/WhoIs.vue
@@ -3,11 +3,11 @@
         <div><strong>Registrar:</strong> {{ whois.Registrar }}</div>
         <div class="flex gap-2">
             <strong>Name Servers:</strong>
-            <ul class="flex gap-2">
+            <ul class="flex flex-wrap gap-2">
                 <li v-for="ns in whois.NameServers" :key="ns">{{ ns }}</li>
             </ul>
         </div>
-        <div class="flex gap-10 items-center">
+        <div class="flex flex-col sm:flex-row gap-4 items-start sm:items-center">
             <ExpiryCountdown :validTo="whois.ExpirationDate" />
             <div><strong>Expiration Date:</strong> {{ whois.ExpirationDate }}</div>
         </div>