diff --git a/src/components/settings/ConnectionsSettings.vue b/src/components/settings/ConnectionsSettings.vue
index d3a9fd36..2e03f11e 100644
--- a/src/components/settings/ConnectionsSettings.vue
+++ b/src/components/settings/ConnectionsSettings.vue
@@ -7,8 +7,10 @@
     <div class="card-body">
       <div class="grid grid-cols-1 gap-2 lg:grid-cols-2">
         <div class="flex items-center gap-2">
-          {{ $t('connectionStyle') }}:
-          {{ $t('table') }}
+          <span class="whitespace-nowrap">
+            {{ $t('connectionStyle') }}:
+            {{ $t('table') }}
+          </span>
           <input
             class="toggle"
             type="checkbox"
diff --git a/src/components/sidebar/ConnectionCtrl.tsx b/src/components/sidebar/ConnectionCtrl.tsx
index 374c17a9..bb23b71d 100644
--- a/src/components/sidebar/ConnectionCtrl.tsx
+++ b/src/components/sidebar/ConnectionCtrl.tsx
@@ -59,7 +59,7 @@ export default defineComponent({
           <span class="shrink-0">{t('sortBy')}</span>
           <div class="join flex-1">
             <select
-              class="join-item select select-bordered select-sm flex-1"
+              class="join-item select select-bordered select-sm flex-1 max-md:w-0"
               v-model={connectionSortType.value}
             >
               {(Object.values(SORT_TYPE) as string[]).map((opt) => (