diff --git a/src/components/ContributionTable.tsx b/src/components/ContributionTable.tsx
index 8b11a87..e793a9a 100644
--- a/src/components/ContributionTable.tsx
+++ b/src/components/ContributionTable.tsx
@@ -21,87 +21,82 @@ export function ContributionTable({ items }: ContributionTableProps) {
   }
 
   return (
-    <div className="hidden md:block overflow-x-auto">
-      <table className="w-full text-sm">
-        <thead>
-          <tr className="border-b text-left text-zinc-500 dark:text-zinc-400">
-            <th className="w-8 pb-2" />
-            <th className="pb-2 font-medium">Title</th>
-            <th className="pb-2 font-medium">Repo</th>
-            <th className="pb-2 font-medium">Status</th>
-            <th className="pb-2 font-medium">Date</th>
-            <th className="w-8 pb-2" />
-          </tr>
-        </thead>
-        <tbody>
-          {items.map((item) => {
-            const isExpanded = expandedId === item.id;
-            const canExpand = item.type === "pr";
-            const [owner, repo] = item.repoNameWithOwner.split("/");
+    <div className="hidden md:block text-sm">
+      {/* Header row */}
+      <div className="flex items-center gap-3 border-b px-2 pb-2 font-medium text-zinc-500 dark:text-zinc-400">
+        <div className="w-4 flex-shrink-0" />
+        <div className="min-w-0 flex-1">Title</div>
+        <div className="w-40 flex-shrink-0">Repo</div>
+        <div className="w-16 flex-shrink-0">Status</div>
+        <div className="w-28 flex-shrink-0">Date</div>
+        <div className="w-4 flex-shrink-0" />
+      </div>
 
-            return (
-              <tr key={item.id} className="group">
-                <td colSpan={6} className="p-0">
-                  <div
+      {/* Data rows */}
+      {items.map((item) => {
+        const isExpanded = expandedId === item.id;
+        const canExpand = item.type === "pr";
+        const [owner, repo] = item.repoNameWithOwner.split("/");
+
+        return (
+          <div key={item.id}>
+            <div
+              className={cn(
+                "flex items-center gap-3 border-b px-2 py-3 transition-colors",
+                canExpand && "cursor-pointer hover:bg-zinc-50 dark:hover:bg-zinc-900",
+              )}
+              onClick={() => {
+                if (canExpand) {
+                  setExpandedId(isExpanded ? null : item.id);
+                }
+              }}
+              role={canExpand ? "button" : undefined}
+              aria-expanded={canExpand ? isExpanded : undefined}
+            >
+              <div className="w-4 flex-shrink-0">
+                {canExpand && (
+                  <ChevronRight
                     className={cn(
-                      "flex items-center gap-3 border-b px-2 py-3 transition-colors",
-                      canExpand && "cursor-pointer hover:bg-zinc-50 dark:hover:bg-zinc-900",
+                      "h-4 w-4 text-zinc-400 transition-transform",
+                      isExpanded && "rotate-90"
                     )}
-                    onClick={() => {
-                      if (canExpand) {
-                        setExpandedId(isExpanded ? null : item.id);
-                      }
-                    }}
-                    role={canExpand ? "button" : undefined}
-                    aria-expanded={canExpand ? isExpanded : undefined}
-                  >
-                    <div className="w-4 flex-shrink-0">
-                      {canExpand && (
-                        <ChevronRight
-                          className={cn(
-                            "h-4 w-4 text-zinc-400 transition-transform",
-                            isExpanded && "rotate-90"
-                          )}
-                        />
-                      )}
-                    </div>
-                    <div className="min-w-0 flex-1">
-                      <span className="truncate">{item.title}</span>
-                    </div>
-                    <div className="hidden sm:block w-40 flex-shrink-0 truncate text-zinc-500 dark:text-zinc-400">
-                      {item.repoNameWithOwner}
-                    </div>
-                    <div className="flex-shrink-0">
-                      <Badge
-                        className={stateColors[item.state]}
-                        variant="outline"
-                      >
-                        {item.state}
-                      </Badge>
-                    </div>
-                    <div className="hidden sm:block w-28 flex-shrink-0 text-zinc-500 dark:text-zinc-400">
-                      {formatDate(item.createdAt)}
-                    </div>
-                    <a
-                      href={item.url}
-                      target="_blank"
-                      rel="noopener noreferrer"
-                      onClick={(e) => e.stopPropagation()}
-                      className="flex-shrink-0 text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200"
-                      aria-label={`Open #${item.number} on GitHub`}
-                    >
-                      <ExternalLink className="h-4 w-4" />
-                    </a>
-                  </div>
-                  {isExpanded && canExpand && (
-                    <ExpandedPRDetail owner={owner} repo={repo} number={item.number} />
-                  )}
-                </td>
-              </tr>
-            );
-          })}
-        </tbody>
-      </table>
+                  />
+                )}
+              </div>
+              <div className="min-w-0 flex-1">
+                <span className="block truncate">{item.title}</span>
+              </div>
+              <div className="w-40 flex-shrink-0 truncate text-zinc-500 dark:text-zinc-400">
+                {item.repoNameWithOwner}
+              </div>
+              <div className="w-16 flex-shrink-0">
+                <Badge
+                  className={stateColors[item.state]}
+                  variant="outline"
+                >
+                  {item.state}
+                </Badge>
+              </div>
+              <div className="w-28 flex-shrink-0 text-zinc-500 dark:text-zinc-400">
+                {formatDate(item.createdAt)}
+              </div>
+              <a
+                href={item.url}
+                target="_blank"
+                rel="noopener noreferrer"
+                onClick={(e) => e.stopPropagation()}
+                className="flex-shrink-0 text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200"
+                aria-label={`Open #${item.number} on GitHub`}
+              >
+                <ExternalLink className="h-4 w-4" />
+              </a>
+            </div>
+            {isExpanded && canExpand && (
+              <ExpandedPRDetail owner={owner} repo={repo} number={item.number} />
+            )}
+          </div>
+        );
+      })}
     </div>
   );
 }
diff --git a/src/components/__tests__/ContributionTable.test.tsx b/src/components/__tests__/ContributionTable.test.tsx
index 579ede7..7fac8e2 100644
--- a/src/components/__tests__/ContributionTable.test.tsx
+++ b/src/components/__tests__/ContributionTable.test.tsx
@@ -75,6 +75,32 @@ describe("ContributionTable", () => {
     expect(issueRow).not.toHaveAttribute("role", "button");
   });
 
+  it("renders column headers", () => {
+    render(<ContributionTable items={items} />);
+
+    expect(screen.getByText("Title")).toBeInTheDocument();
+    expect(screen.getByText("Repo")).toBeInTheDocument();
+    expect(screen.getByText("Status")).toBeInTheDocument();
+    expect(screen.getByText("Date")).toBeInTheDocument();
+  });
+
+  it("renders repo name and date for each row", () => {
+    render(<ContributionTable items={items} />);
+
+    expect(screen.getAllByText("bitcoin/bitcoin")).toHaveLength(2);
+  });
+
+  it("collapses expanded PR when clicked again", () => {
+    render(<ContributionTable items={items} />);
+
+    const row = screen.getByText("Fix consensus bug").closest("[role='button']");
+    fireEvent.click(row!);
+    expect(screen.getByTestId("pr-detail")).toBeInTheDocument();
+
+    fireEvent.click(row!);
+    expect(screen.queryByTestId("pr-detail")).not.toBeInTheDocument();
+  });
+
   it("has external links to GitHub", () => {
     render(<ContributionTable items={items} />);