diff --git a/buildsystem/network-sharing-server/src/pages/AudioAlbums.vue b/buildsystem/network-sharing-server/src/pages/AudioAlbums.vue
index 4a3dc5547..d5def4ad7 100644
--- a/buildsystem/network-sharing-server/src/pages/AudioAlbums.vue
+++ b/buildsystem/network-sharing-server/src/pages/AudioAlbums.vue
@@ -9,7 +9,7 @@
 
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="album in albums" :key="album.id">
+            <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="album in albums" :key="album.id">
                 <MediaCardItem :media="album" :mediaType="'album'" />
             </div>
         </div>
diff --git a/buildsystem/network-sharing-server/src/pages/AudioArtists.vue b/buildsystem/network-sharing-server/src/pages/AudioArtists.vue
index 128728a4b..e30fc2618 100644
--- a/buildsystem/network-sharing-server/src/pages/AudioArtists.vue
+++ b/buildsystem/network-sharing-server/src/pages/AudioArtists.vue
@@ -1,5 +1,5 @@
 <template>
-    <div v-if="loaded && this.artists.length !== 0" class="container">
+    <div v-if="loaded && this.artists.length !== 0" class="container container-sm">
         <div v-if="this.appStore.displayType[this.$route.name]" class="row gx-3 gy-3 media-list">
             <template v-for="artist in artists" :key="artist.id">
                 <MediaListItem :media="artist" :mediaType="'artist'" />
@@ -7,7 +7,7 @@
             </template>
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="artist in artists" :key="artist.id">
+            <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="artist in artists" :key="artist.id">
                 <MediaCardItem :media="artist" :mediaType="'artist'" />
             </div>
         </div>
diff --git a/buildsystem/network-sharing-server/src/pages/AudioGenres.vue b/buildsystem/network-sharing-server/src/pages/AudioGenres.vue
index 9df1e7671..3fdaa192b 100644
--- a/buildsystem/network-sharing-server/src/pages/AudioGenres.vue
+++ b/buildsystem/network-sharing-server/src/pages/AudioGenres.vue
@@ -6,7 +6,7 @@
             </template>
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="genre in genres" :key="genre.id">
+            <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="genre in genres" :key="genre.id">
                 <MediaCardItem :media="genre" :mediaType="'genre'" />
             </div>
         </div>
diff --git a/buildsystem/network-sharing-server/src/pages/AudioTracks.vue b/buildsystem/network-sharing-server/src/pages/AudioTracks.vue
index 1121e29b1..d6d8e94f6 100644
--- a/buildsystem/network-sharing-server/src/pages/AudioTracks.vue
+++ b/buildsystem/network-sharing-server/src/pages/AudioTracks.vue
@@ -6,7 +6,7 @@
             </template>
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="track in tracks" :key="track.id">
+            <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="track in tracks" :key="track.id">
                 <MediaCardItem :media="track" :downloadable="true" :mediaType="'track'" />
             </div>
         </div>
diff --git a/buildsystem/network-sharing-server/src/pages/BrowseChild.vue b/buildsystem/network-sharing-server/src/pages/BrowseChild.vue
index 825829a95..e00a4ed2e 100644
--- a/buildsystem/network-sharing-server/src/pages/BrowseChild.vue
+++ b/buildsystem/network-sharing-server/src/pages/BrowseChild.vue
@@ -6,7 +6,7 @@
             </template>
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="item in browseResult" :key="item.id">
+            <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="item in browseResult" :key="item.id">
                 <MediaCardItem :media="item" :mediaType="(item.isFolder) ? 'folder' : 'file'" />
             </div>
         </div>
diff --git a/buildsystem/network-sharing-server/src/pages/BrowseList.vue b/buildsystem/network-sharing-server/src/pages/BrowseList.vue
index dacd68e6f..4a4c141f9 100644
--- a/buildsystem/network-sharing-server/src/pages/BrowseList.vue
+++ b/buildsystem/network-sharing-server/src/pages/BrowseList.vue
@@ -14,7 +14,7 @@
                 </template>
             </div>
             <div v-else class="row gx-3 gy-3 media-content">
-                <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="favorite in favorites" :key="favorite.id">
+                <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="favorite in favorites" :key="favorite.id">
                     <MediaCardItem :media="favorite" :mediaType="'folder'" :hideOverflow="true" />
                 </div>
             </div>
@@ -37,7 +37,7 @@
                 </template>
             </div>
             <div v-else class="row gx-3 gy-3 media-content">
-                <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="storage in storages" :key="storage.id">
+                <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="storage in storages" :key="storage.id">
                     <MediaCardItem :media="storage" :mediaType="'folder'" :hideOverflow="true" />
                 </div>
             </div>
@@ -61,7 +61,7 @@
                 </template>
             </div>
             <div v-else class="row gx-3 gy-3 media-content">
-                <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="network in networkEntries" :key="network.id">
+                <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="network in networkEntries" :key="network.id">
                     <MediaCardItem :media="network" :mediaType="'network'" :hideOverflow="true" />
                 </div>
             </div>
diff --git a/buildsystem/network-sharing-server/src/pages/PlaylistList.vue b/buildsystem/network-sharing-server/src/pages/PlaylistList.vue
index 3b4e21b3a..064bf7e94 100644
--- a/buildsystem/network-sharing-server/src/pages/PlaylistList.vue
+++ b/buildsystem/network-sharing-server/src/pages/PlaylistList.vue
@@ -6,7 +6,7 @@
             </template>
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-lg-2 col-sm-4 col-xs-6" v-for="playlist in playlists" :key="playlist.id">
+            <div class="col-md-3 col-lg-2 col-sm-4 col-6" v-for="playlist in playlists" :key="playlist.id">
                 <MediaCardItem :media="playlist" :mediaType="'playlist'" />
             </div>
         </div>
diff --git a/buildsystem/network-sharing-server/src/pages/VideoList.vue b/buildsystem/network-sharing-server/src/pages/VideoList.vue
index af0d3ca33..3c31ab87c 100644
--- a/buildsystem/network-sharing-server/src/pages/VideoList.vue
+++ b/buildsystem/network-sharing-server/src/pages/VideoList.vue
@@ -6,7 +6,7 @@
             </template>
         </div>
         <div v-else class="row gx-3 gy-3 media-content">
-            <div class="col-md-3 col-sm-4 col-xs-6" v-for="video in videos" :key="video.id">
+            <div class="col-md-3 col-sm-4 col-6" v-for="video in videos" :key="video.id">
                 <MediaCardItem :media="video" :downloadable="true" :mediaType="'video'" />
             </div>
         </div>