There is also a Greasy Fork script called “ChaptGPT Widescreen Mode”
Works like a charm.
1 Like
This tampermonkey script works (still leaving margin though), while my previous “wide” was broken by page changes.
https://www.reddit.com/r/ChatGPT/comments/15nbpaa/chatgpts_webinterface_width_fix/
1 Like
Well, let’s try. My chrome is not able to access google account.
Thanks for the setup details, this has been bugging me for ages!
Something (things) has changed. c h a t . o p e n a i . c o m now redirects to c h a t g p t . c o m. This breaks the Wide GPT extension. I tried modifying the tampermonkey script posted here and add a new match line. It doesn’t seem to work. Tried to change the manifest on the Wide GPT extension - but I am missing something. Might need to be resigned (might be cached). I could dig into the page’s CSS and js, but will take time and I am a bit rusty.
Go to the Chrome Store and search for WideGPT, I’m actively maintaining this extension to address this problem.
1 Like
Yup, they did, I just fixed my extension to address this change. Look for WideGPT on Google Chrome app store.
1 Like
I modified my own script, and that modification was just changing the domain to have it work again.
I have more UI tweaks that don’t play nice with “light” theme and are suited to just what I like.
The original request was for code blocks to be expanded in width, which is sorely needed. However, the solutions presented thus far, including the extension by @juanbiscaia just expand the width of the entire text column. This unfortunately significantly affects the readability of the non-code blocks of text on wider displays. The ideal character length per line is around 45-75, which is why the chat interface has relatively narrow columns in the first place.
The question is: can the fix be applied just to code blocks, leaving the rest of the interface intact?
The extension I made has a slider to set how wide the column should be. Targeting only code blocks is a challenge, but doable, I’m working to add this feature to it.
It can be applied to everything but code blocks…
In the above, I have variable maximum widths that should cover all scenarios, including images wider but not too wide, inputs that allow you to see your wide code, lists a bit longer because the eye follows them without needing wrap. etc.
Minimum Tampermonkey script to inject CSS (with the !important CSS you can get into ChatGPT with other methods also)
// ==UserScript==
// @name ChatGPT Max Code Width
// @namespace http://tampermonkey.net/
// @version 2024-05-14
// @description make all widths wide, then narrow message text
// @author -J
// @match https://chatgpt.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=chatgpt.com
// @grant none
// ==/UserScript==
(function() {
const messagesCss = `
.xl\\:max-w-\\[48rem\\] {
max-width: 100% !important;
}
.lg\\:max-w-\\[40rem\\] {
max-width: 100% !important;
}
.md\\:max-w-3xl {
max-width: 100% !important;
}
.max-w-\\[90\\%\\] {
max-width: 99rem !important;
}
.xl\\:px-5 {
padding-left: .25rem !important;
padding-right: .25rem;
}
.w-8 {
width: 1.5rem !important;
}
.aspect-\\[7\\/4\\] {
aspect-ratio: 7/4;
max-width: 1280px;
}
ul, ol, li {
max-width: 66rem !important;
}
fieldset, figure, h1, h2, h3, h4, h5, h6 {
max-width: 55rem !important;
}
p, ul, ol {
max-width: 44rem !important;
}
`;
const cssStyles = (messagesCss).replaceAll("\t", ' ');
// Create a new <style> element and set its content to the CSS rules
var styleElement = document.createElement("style");
styleElement.innerHTML = cssStyles;
// Append the new <style> element to the <head> section of the document
document.head.appendChild(styleElement);
})();
One year later… 
For Firefox users this extension works.
Just install, click on Find Styles while on the ChatGPT website and choose one of the full width text styles.