Fixed a padding error in item card

src/components/CommunityComponents/CommunityHome.vue

@@ -33,7 +33,7 @@
           />
         </div>
 
-        <div class="absolute inset-x-0 px-5 py-3">
+        <div class="absolute inset-x-0">
           <!-- ItemCards -->
           <div class="flex items-center justify-center w-screen">
             <!-- Shows items based on pagination -->

src/components/ItemComponents/ItemCard.vue

 <template>
-  <div class="mt-5">
+  <div class="mt-5 px-5">
     <div
-      class="w-[80%] h-full rounded bg-gray-200 overflow-hidden display:inline-block correct-size"
+      class="w-full h-full rounded bg-gray-200 overflow-hidden display:inline-block correct-size"
     >
-      <div class="relative h-0 pb-[66%]">
+      <div class="relative h-0 pb-[66.7%]">
         <img
           class="w-full h-full absolute inset-0"
           :src="item.img || require('../../assets/default-product.png')"
@@ -11,13 +11,13 @@
         />
       </div>
       <div class="p-1 m-1 bottom-0">
-        <p class="text-gray-700 text-xs font-bold" id="adress">
-          {{ item.address }}
-        </p>
         <p class="font-bold text-sm" id="title">{{ item.title }}</p>
         <p class="text-gray-700 text-xs" id="price">
           {{ item.pricePerDay }} kr
         </p>
+        <p class="text-gray-700 text-xs font-bold" id="adress">
+          {{ item.address }}
+        </p>
       </div>
     </div>
   </div>