diff --git a/src/components/messageStream/MessageBubble.tsx b/src/components/messageStream/MessageBubble.tsx
index 00fafad..0cb931f 100644
--- a/src/components/messageStream/MessageBubble.tsx
+++ b/src/components/messageStream/MessageBubble.tsx
@@ -27,11 +27,18 @@ export function MessageBubble({ post }: { post: Post }) {
   const { lang } = useI18n();
   const Bubble = pickBubble(post);
   const isTextOnly = post.attachments.length === 0;
+  const isVisual = post.attachments.some(
+    (a) => a.kind === "image" || a.kind === "video",
+  );
 
   return (
     <article
       id={`post-${post.id}`}
-      className={`relative mx-auto w-full max-w-[380px] rounded-2xl bg-ark-panel text-left shadow-sm md:max-w-[680px] lg:max-w-[900px] xl:max-w-[1120px] ${isTextOnly ? "px-3 py-2" : "p-2"}`}
+      className={`relative rounded-2xl bg-ark-panel text-left shadow-sm ${
+        isVisual
+          ? "mx-auto w-full max-w-[380px] md:max-w-[680px] lg:max-w-[900px] xl:max-w-[1120px]"
+          : "self-start w-fit max-w-[92%] md:max-w-[680px] lg:max-w-[760px] xl:max-w-[820px]"
+      } ${isTextOnly ? "px-3 py-2" : "p-2"}`}
     >
       <Bubble post={post} />
       <time