[GH-ISSUE #5973] [bug]: Horizontal scrollbar visible in Firefox for body/header input fields #2348

New issue

Closed

opened 2026-03-17 00:02:07 +03:00 by kerem · 1 comment

kerem commented

2026-03-17 00:02:07 +03:00

Owner

Originally created by @AbishekRaj2007 on GitHub (Mar 11, 2026).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/5973

Is there an existing issue for this?

I have searched existing issues and this bug hasn't been reported yet

Platform

Web App

Browser

Firefox

Operating System

Windows

Bug Description

What happened?

When a long string is entered in the Header Key field, the text overflows the cell boundary instead of being truncated with an ellipsis (...). The text spills into adjacent columns (Value, Description) making the UI unreadable and broken.

[No error message — this is a visual/UI bug]

What I expected is: Long text in the Header Key field should be clipped and truncated with ... (text-overflow: ellipsis) to stay within its column boundary, consistent with standard table/grid UI behavior.

Steps to reproduce

Go to 'https://hoppscotch.io' on any browser
Open any REST request
Click on the 'Headers' tab in the request builder
Click the '+' button to add a new header row
In the 'Key' field, paste a very long string (e.g. 100+ characters)
See the text overflow and spill beyond the Key column boundary into Value and Description columns

Screenshots

Additional context

Interceptor used: Browser (Web app — hoppscotch.io)

This is a straightforward CSS fix — adding the following to the Key input cell should resolve it:
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

Logs and Console Output

N/A — this is a pure CSS/UI rendering bug. No console errors observed.

Additional details (if relevant)

Device specifics: Windows 11, Chrome / Firefox (latest stable) — reproducible on all browsers
Special configurations: None — reproducible without any extensions or special setup

Deployment Type

Hoppscotch Cloud

Version

v2026.2.1

Originally created by @AbishekRaj2007 on GitHub (Mar 11, 2026). Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/5973 ### Is there an existing issue for this? - [x] I have searched existing issues and this bug hasn't been reported yet ### Platform Web App ### Browser Firefox ### Operating System Windows ### Bug Description ## What happened? When a long string is entered in the Header **Key** field, the text overflows the cell boundary instead of being truncated with an ellipsis (`...`). The text spills into adjacent columns (Value, Description) making the UI unreadable and broken. [No error message — this is a visual/UI bug] What I expected is: Long text in the Header Key field should be clipped and truncated with `...` (text-overflow: ellipsis) to stay within its column boundary, consistent with standard table/grid UI behavior. ## Steps to reproduce 1. Go to 'https://hoppscotch.io' on any browser 2. Open any REST request 3. Click on the 'Headers' tab in the request builder 4. Click the '+' button to add a new header row 5. In the 'Key' field, paste a very long string (e.g. 100+ characters) 6. See the text overflow and spill beyond the Key column boundary into Value and Description columns ## Screenshots <img width="1395" height="410" alt="Image" src="https://github.com/user-attachments/assets/88fb1d22-eeec-425f-9ef2-c386b7408000" /> <img width="1382" height="418" alt="Image" src="https://github.com/user-attachments/assets/95df3f5c-3706-4519-8bbf-77dfaf396858" /> ## Additional context Interceptor used: Browser (Web app — hoppscotch.io) This is a straightforward CSS fix — adding the following to the Key input cell should resolve it: overflow: hidden; text-overflow: ellipsis; white-space: nowrap; ## Logs and Console Output N/A — this is a pure CSS/UI rendering bug. No console errors observed. ## Additional details (if relevant) - Device specifics: Windows 11, Chrome / Firefox (latest stable) — reproducible on all browsers - Special configurations: None — reproducible without any extensions or special setup ### Deployment Type Hoppscotch Cloud ### Version v2026.2.1

kerem

2026-03-17 00:02:07 +03:00

closed this issue
added the
bug

need testing
labels

kerem commented

2026-03-17 00:02:23 +03:00

Author

Owner

@nivedin commented on GitHub (Mar 11, 2026):

This issue is already patched in the latest release 2026.2.1

@nivedin commented on GitHub (Mar 11, 2026): This issue is already patched in the latest release [2026.2.1](https://github.com/hoppscotch/hoppscotch/releases/tag/2026.2.1)