diff --git a/packages/html-reporter/src/chip.css b/packages/html-reporter/src/chip.css
index c2bf103bfaa60..f8d7938f90ec8 100644
--- a/packages/html-reporter/src/chip.css
+++ b/packages/html-reporter/src/chip.css
@@ -21,6 +21,7 @@
   background-color: var(--color-canvas-subtle);
   padding: 0 8px;
   border-bottom: none;
+  margin-top: 24px;
   font-weight: 600;
   line-height: 38px;
   white-space: nowrap;
diff --git a/packages/html-reporter/src/filter.ts b/packages/html-reporter/src/filter.ts
index 88fa56fbe34dd..b0e8e4645042d 100644
--- a/packages/html-reporter/src/filter.ts
+++ b/packages/html-reporter/src/filter.ts
@@ -84,7 +84,7 @@ export class Filter {
         token.push(c);
         continue;
       }
-      if (c === ' ') {
+      if (c === ' ' || c === ':') {
         if (token.length) {
           result.push(token.join('').toLowerCase());
           token = [];
@@ -108,7 +108,7 @@ export class Filter {
       if (test.outcome === 'skipped')
         status = 'skipped';
       const searchValues: SearchValues = {
-        text: (status + ' ' + test.projectName + ' ' + test.path.join(' ') + ' ' + test.title).toLowerCase(),
+        text: (status + ' ' + test.projectName + ' ' + test.location.file + ' ' + test.location.line + ' ' + test.path.join(' ') + ' ' + test.title).toLowerCase(),
         project: test.projectName.toLowerCase(),
         status: status as any,
       };
diff --git a/packages/html-reporter/src/imageDiffView.spec.tsx b/packages/html-reporter/src/imageDiffView.spec.tsx
index 53ffce0c1be37..d2339919b0a8c 100644
--- a/packages/html-reporter/src/imageDiffView.spec.tsx
+++ b/packages/html-reporter/src/imageDiffView.spec.tsx
@@ -55,7 +55,7 @@ test('should switch to actual', async ({ mount }) => {
   for (let i = 0; i < imageCount; ++i) {
     const image = images.nth(i);
     const box = await image.boundingBox();
-    expect(box).toEqual({ x: 400, y: 124, width: 200, height: 200 });
+    expect(box).toEqual({ x: 400, y: 108, width: 200, height: 200 });
   }
 });
 
@@ -70,7 +70,7 @@ test('should switch to expected', async ({ mount }) => {
   for (let i = 0; i < imageCount; ++i) {
     const image = images.nth(i);
     const box = await image.boundingBox();
-    expect(box).toEqual({ x: 400, y: 124, width: 200, height: 200 });
+    expect(box).toEqual({ x: 400, y: 108, width: 200, height: 200 });
   }
 });
 
@@ -79,5 +79,5 @@ test('should show diff by default', async ({ mount }) => {
 
   const image = component.locator('img');
   const box = await image.boundingBox();
-  expect(box).toEqual({ x: 400, y: 124, width: 200, height: 200 });
+  expect(box).toEqual({ x: 400, y: 108, width: 200, height: 200 });
 });
diff --git a/packages/html-reporter/src/tabbedPane.css b/packages/html-reporter/src/tabbedPane.css
index e939859a79183..7a128da217f7e 100644
--- a/packages/html-reporter/src/tabbedPane.css
+++ b/packages/html-reporter/src/tabbedPane.css
@@ -33,7 +33,6 @@
   height: 48px;
   min-width: 70px;
   box-shadow: inset 0 -1px 0 var(--color-border-muted) !important;
-  margin-bottom: 16px;
 }
 
 .tabbed-pane-tab-strip:focus {
diff --git a/packages/html-reporter/src/testCaseView.css b/packages/html-reporter/src/testCaseView.css
index 81b2b16ed1755..d87cf3aacbd97 100644
--- a/packages/html-reporter/src/testCaseView.css
+++ b/packages/html-reporter/src/testCaseView.css
@@ -46,7 +46,7 @@
 .test-case-duration {
   flex: none;
   align-items: center;
-  padding: 0 8px 24px;
+  padding: 0 8px 8px;
 }
 
 .test-case-path {
diff --git a/tests/playwright-test/reporter-html.spec.ts b/tests/playwright-test/reporter-html.spec.ts
index 102121d4281ef..9ab49f9060dbf 100644
--- a/tests/playwright-test/reporter-html.spec.ts
+++ b/tests/playwright-test/reporter-html.spec.ts
@@ -1348,7 +1348,7 @@ test.describe('labels', () => {
     const result = await runInlineTest({
       'a.test.js': `
         const { expect, test } = require('@playwright/test');
-        const tags = ['@smoke:p1', '@issue[123]', '@issue#123', '@$$$', '@tl/dr'];
+        const tags = ['@smoke-p1', '@issue[123]', '@issue#123', '@$$$', '@tl/dr'];
 
         test.describe('Error Pages', () => {
           tags.forEach(tag => {
@@ -1364,7 +1364,7 @@ test.describe('labels', () => {
     expect(result.passed).toBe(5);
 
     await showReport();
-    const tags = ['smoke:p1', 'issue[123]', 'issue#123', '$$$', 'tl/dr'];
+    const tags = ['smoke-p1', 'issue[123]', 'issue#123', '$$$', 'tl/dr'];
     const searchInput = page.locator('.subnav-search-input');
 
     for (const tag of tags) {