I get that it's trendy to make super wide margins on pages. Just like that accursed light to medium grey on white text is popular (thank goodness for "Color Changer").
However, I'm a bit old school in that I prefer to have the text fill up the entire window. If I want narrower text, I'll resize the window to make it narrow and expect the text to rewrap.
I know that on mobile horizontal scrolling is all the rage, but I hate that too.
Is there any extension that will take a website like imdb.com, GoG's forums, and countless others that put these super wide margins and make the page fill the whole screen?
Again, I'm a bit old school, so maybe "margin" is not the right word. Back when I was in school we called blank space on the edges of a page "margins" so that's the term I'm using.
There used to be an extension called "Dr. Body Narrow" designed to narrow web pages, but it could be used to do the opposite and widen them to whatever your screen with was if you set it. However it was never updated after the transition to web extensions and thus doesn't work with modern Firefox. Is there anything like that these days?
Addon/bookmarklet/extension to make websites use full window
-
- Posts: 553
- Joined: September 1st, 2010, 1:57 am
Addon/bookmarklet/extension to make websites use full window
Last edited by slickrcbd on April 15th, 2024, 12:18 pm, edited 1 time in total.
-
- Posts: 6437
- Joined: February 3rd, 2009, 6:29 pm
Re: Addon/bookmarklet/extension to make websites use full wi
I peeked at the source in the .xpi file. It's a simple addon.slickrcbd wrote:extension called "Dr. Body Narrow" designed to narrow web pages
Dr. Body Narrow
http://www.softsea.com/review/Dr-Body-Narrow.html
I can create a toggling bookmarklet based on the addon.
* Set page width to 960 pixels
* Align page left
Code: Select all
javascript:(function(){
var element = document.getElementById("setPageWidth960alignPageLeft");
if (element) {
element.parentNode.removeChild(element);
} else {
var style = document.createElement("style");
style.type = "text/css";
style.id = "setPageWidth960alignPageLeft";
style.textContent = [
"body { width: 960px !important; float: left !important; margin: auto !important; }",
].join("\n");
if (document.head) {
document.head.appendChild(style);
} else {
document.documentElement.appendChild(style);
}
}
})();
http://subsimple.com/bookmarklets/jsbuilder.htm
Test page
http://www.imdb.com/
-
- Posts: 553
- Joined: September 1st, 2010, 1:57 am
Re: Addon/bookmarklet/extension to make websites use full wi
It seems it works for narrowing (what it was intended to do), but it failed to widen the GoG forum, which I happened to have open in another tab.
Any suggestions on using the full size of the window for sites like this?
https://www.gog.com/forum/general
Any suggestions on using the full size of the window for sites like this?
https://www.gog.com/forum/general
-
- Posts: 6437
- Joined: February 3rd, 2009, 6:29 pm
Re: Addon/bookmarklet/extension to make websites use full wi
The GoG forum uses a width property on almost every div. Try resetting the width property to the default value.
CSS Reference
http://www.w3schools.com/cssref/pr_dim_width.php
http://www.w3schools.com/cssref/pr_dim_min-width.php
There may not be a simple style that works for a particular website.
It's not possible to create a complex style that works for every website.
Code: Select all
javascript:(function(){
var element = document.getElementById("cowabunga");
if (element) {
element.parentNode.removeChild(element);
} else {
var style = document.createElement("style");
style.type = "text/css";
style.id = "cowabunga";
style.textContent = [
"div { width: auto !important; min-width: 0 !important; }",
].join("\n");
if (document.head) {
document.head.appendChild(style);
} else {
document.documentElement.appendChild(style);
}
}
})();
http://www.w3schools.com/cssref/pr_dim_width.php
http://www.w3schools.com/cssref/pr_dim_min-width.php
There may not be a simple style that works for a particular website.
It's not possible to create a complex style that works for every website.
-
- Posts: 553
- Joined: September 1st, 2010, 1:57 am
Re: Addon/bookmarklet/extension to make websites use full wi
Does this need to be taylored for every website? I was just looking into something because I'm suddenly locked out of one of my Google accounts which keeps demanding my cell phone number that I do not want associated with it. I have a second Google account for my cell phone.
Anyways, while doing the research I kept finding web pages like this one
https://www.infoworld.com/article/28540 ... -give.html
or this one
https://www.vox.com/recode/23604327/wha ... rity-risks
that do not use the full width of the monitor.
If I wanted narrow text, I'd "restore" the window instead of maximizing it.
Didn't find much about what I was actually looking for, and stuff like this is what you get for just opening the first ten matches into tabs and looking at the resulting articles.
Anyways, the point is I'm looking for something to make websites like that use the whole page. I know it's trendy, and those margins aren't that bad compared to some others that only use 1/4 of the screen, but I still find it annoying.
What happened to resizing the window if the user preferred a narrower text field anyways? Isn't that what it's for?
Anyways, while doing the research I kept finding web pages like this one
https://www.infoworld.com/article/28540 ... -give.html
or this one
https://www.vox.com/recode/23604327/wha ... rity-risks
that do not use the full width of the monitor.
If I wanted narrow text, I'd "restore" the window instead of maximizing it.
Didn't find much about what I was actually looking for, and stuff like this is what you get for just opening the first ten matches into tabs and looking at the resulting articles.
Anyways, the point is I'm looking for something to make websites like that use the whole page. I know it's trendy, and those margins aren't that bad compared to some others that only use 1/4 of the screen, but I still find it annoying.
What happened to resizing the window if the user preferred a narrower text field anyways? Isn't that what it's for?
-
- Posts: 6437
- Joined: February 3rd, 2009, 6:29 pm
Re: Addon/bookmarklet/extension to make websites use full wi
A simple style may work for multiple websites. The following toggling bookmarklet works with the imdb, infoworld and vox websites. However, that bookmarklet may not work on some pages of those websites.slickrcbd wrote:Does this need to be taylored for every website?
Code: Select all
javascript:(function(){
var element = document.getElementById("cowabunga");
if (element) {
element.parentNode.removeChild(element);
} else {
var style = document.createElement("style");
style.type = "text/css";
style.id = "cowabunga";
style.textContent = [
"* { max-width: none !important; }",
].join("\n");
if (document.head) {
document.head.appendChild(style);
} else {
document.documentElement.appendChild(style);
}
}
})();
http://www.imdb.com/ (succeeds)
http://www.imdb.com/title/tt0087182/ (succeeds)
http://www.imdb.com/pressroom/ (fails)
...
There are readability addons and bookmarklets available to improve the readability of web articles.
AMO search results
http://addons.mozilla.org/firefox/search/?q=Readability
http://addons.mozilla.org/firefox/search/?q=Reader
Readability bookmarklets
http://landerlyoung.github.io/assets/st ... ity-0.5.1/
http://brettterpstra.com/share/readability2.html
I changed the protocol to "https:" in the bookmarklets so I don't need to "load unsafe scripts" from "unauthenticated sources".
...
You can disable all styles with the Web Developer addon.
Web Developer
http://addons.mozilla.org/firefox/addon/60
Web Developer button > CSS > [check] Disable All Styles
How to Disable Website CSS Style
http://technocript.com/how-to-disable-w ... efox-edge/
...
Maybe ask your questions in a UX forum.
Why do many sites leave half of each webpage empty?
http://ux.stackexchange.com/questions/104705
UX questions tagged [white-space] sorted by votes
http://ux.stackexchange.com/questions/t ... ?tab=Votes