diff --git a/.changeset/warm-goats-stare.md b/.changeset/warm-goats-stare.md
new file mode 100644
index 0000000000..2f9280ca97
--- /dev/null
+++ b/.changeset/warm-goats-stare.md
@@ -0,0 +1,5 @@
+---
+"@lynx-js/web-elements": patch
+---
+
+fix: list-item should support linear layout.
diff --git a/packages/web-platform/web-elements/src/common-css/linear.css b/packages/web-platform/web-elements/src/common-css/linear.css
index 8f0f77976b..427be3215c 100644
--- a/packages/web-platform/web-elements/src/common-css/linear.css
+++ b/packages/web-platform/web-elements/src/common-css/linear.css
@@ -146,7 +146,8 @@ x-refresh-header,
x-refresh-view,
x-swiper-item,
x-viewpager-item-ng,
-x-viewpager-ng {
+x-viewpager-ng,
+list-item {
/*
--lynx-display-toggle is compile-time generated.
*/
@@ -195,7 +196,8 @@ x-refresh-header,
x-refresh-view,
x-swiper-item,
x-viewpager-item-ng,
-x-viewpager-ng {
+x-viewpager-ng,
+list-item {
flex-wrap: var(--lynx-display-linear, nowrap)
var(
--lynx-display-flex,
diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts b/packages/web-platform/web-tests/tests/web-elements.spec.ts
index e9e9ea95c2..324d876fb5 100644
--- a/packages/web-platform/web-tests/tests/web-elements.spec.ts
+++ b/packages/web-platform/web-tests/tests/web-elements.spec.ts
@@ -2346,6 +2346,11 @@ test.describe('web-elements test suite', () => {
expect(scrolltolower).toBeTruthy();
},
);
+ test('list-item-linear', async ({ page }, { titlePath }) => {
+ const title = getTitle(titlePath);
+ await gotoWebComponentPage(page, title);
+ await diffScreenShot(page, title, 'index');
+ });
});
test.describe('x-input', () => {
test('placeholder', async ({ page }, { titlePath }) => {
diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-chromium-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-chromium-linux.png
new file mode 100644
index 0000000000..7ccf95a8f9
Binary files /dev/null and b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-chromium-linux.png differ
diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-firefox-linux.png
new file mode 100644
index 0000000000..ef527c9b21
Binary files /dev/null and b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-firefox-linux.png differ
diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-webkit-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-webkit-linux.png
new file mode 100644
index 0000000000..849b83edf3
Binary files /dev/null and b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-item-linear/index-webkit-linux.png differ
diff --git a/packages/web-platform/web-tests/tests/web-elements/x-list/list-item-linear.html b/packages/web-platform/web-tests/tests/web-elements/x-list/list-item-linear.html
new file mode 100644
index 0000000000..c17db84690
--- /dev/null
+++ b/packages/web-platform/web-tests/tests/web-elements/x-list/list-item-linear.html
@@ -0,0 +1,59 @@
+
+
+
+
+
+ web playground
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+