LMArena Chat Full Width

Remove max-width constraints from LMArena chat containers for a full-width reading experience. Works across all chat modes.

スクリプトをインストールするには、Tampermonkey, GreasemonkeyViolentmonkey のような拡張機能のインストールが必要です。

You will need to install an extension such as Tampermonkey to install this script.

スクリプトをインストールするには、TampermonkeyViolentmonkey のような拡張機能のインストールが必要です。

スクリプトをインストールするには、TampermonkeyUserscripts のような拡張機能のインストールが必要です。

このスクリプトをインストールするには、Tampermonkeyなどの拡張機能をインストールする必要があります。

このスクリプトをインストールするには、ユーザースクリプト管理ツールの拡張機能をインストールする必要があります。

(ユーザースクリプト管理ツールは設定済みなのでインストール!)

このスタイルをインストールするには、Stylusなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus などの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus tなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

(ユーザースタイル管理ツールは設定済みなのでインストール!)

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください
作者
Marx Einstein
1日のインストール数
0
累計インストール数
8
評価
0 0 0
バージョン
1.0.0
作成日
2026/01/19
更新日
2026/01/19
大きさ
17.6KB
ライセンス
MIT
対象サイト

LMArena Chat Full Width

Expand your chat view to full width on LMArena for a better reading experience.


✨ Features

  • Full-width chat messages — Removes all max-width constraints from chat containers
  • Works everywhere — Supports Direct Chat, Arena Battle, and all other modes
  • Zero configuration — Just install and enjoy
  • Performance optimized — CSS-first approach with minimal JavaScript overhead
  • No flickering — Styles are injected at document-start to prevent FOUC

🎯 Why This Script?

LMArena's default chat layout restricts message width, which can be frustrating when:

  • Reading long code blocks that get wrapped unnecessarily
  • Viewing wide tables or formatted content
  • Simply preferring a more spacious reading experience on a wide monitor

This script removes those width constraints, allowing chat messages to use your full screen width.


🌐 Supported Sites


📦 Installation

  1. Install a userscript manager:

  2. Click the Install button on this page

  3. Visit LMArena and enjoy full-width chat!


🔧 Technical Details

This script uses a multi-layered approach to ensure comprehensive coverage:

Layer Method Purpose
1 CSS injection at document-start Immediate effect, prevents flash of styled content
2 Multiple CSS selectors Covers Sentry components, Tailwind classes, structural elements
3 JavaScript DOM traversal Handles edge cases like inline styles
4 MutationObserver Responds to dynamically loaded chat messages

Targeted Elements

  • [data-sentry-component="UserMessage"]
  • [data-sentry-component="BotMessage"]
  • [data-sentry-component="AIMessage"]
  • [data-sentry-component="ParallelMessageGroup"]
  • Tailwind max-w-* utility classes
  • Chat list containers (main ol)

🤝 Compatibility

Browser Status
Chrome / Edge / Brave ✅ Fully supported
Firefox ✅ Fully supported
Safari ✅ Supported (requires userscript extension)

Note: This script uses CSS :has() selector, which is supported in all modern browsers (Chrome 105+, Firefox 121+, Safari 15.4+).


❓ FAQ

Q: Does this affect Arena Battle mode's side-by-side layout? A: The script removes width constraints but preserves the flex layout structure. Both Model A and Model B panels will expand within their respective containers.

Q: Will this break if LMArena updates their site? A: The script uses stable data-sentry-component attributes which are less likely to change. If issues occur, please report them!

Q: Can I customize which pages this applies to? A: You can modify the @match patterns in the script header to limit the scope.


🐛 Bug Reports & Suggestions

If you encounter any issues or have suggestions, please:

  1. Open the browser console (F12) to check for errors
  2. Report the issue with details about your browser and the specific page URL

📄 License

MIT License — Feel free to modify and redistribute.