Extension to use the full screen width

[slickrcbd]

Somebody linked me to an article. The web designer thought it made it more "readable" to leave these wide margins on the page. Apparently there is some benefit for mobile readers trying to zoom since mobiles don't do rewrapping/reflowing text the way browsers used to in the early days.

In any case, I hate all that whitespace on either side. What the CSS used to make the effect is might be different things, I call it a margin. I don't know CSS, I don't know what it's properly called.
Worse, if I zoom out, since the text appears oversized, it actually INCREASES the size of the margin. Even when that doesn't happen, the margin stays the same, but the text gets smaller.
I hate that "feature".
Is there any extension or stylesheet that I can use to point at that kind of thing and make it use the entire screen? If I don't want the text taking up the entire window, I can just resize the window. The text should then rewrap to fit the new window (which I normally keep maximized).

So, regardless on the semantics if I'm using the correct word "margin", how do I fix the margins on pages like this:
https://thoughtcatalog.com/carmen-reini ... f-reading/
I'm not looking for a one-off fix for this specific page on this specific website, but something that works everywhere, or a button I can use to point and click at and say "Fix this margin!".

[morat]

Did you try styling the Reader View page using the userContent.css file?

View a page in Reader View
http://support.mozilla.org/kb/firefox-r ... -web-pages

Code: Select all

/* Firefox userContent.css */

@-moz-document url-prefix("about:reader") {
  :root {
    --body-padding: 0 !important;
  }
  div.container {
    margin: 0 !important;
    max-width: none !important;
  }
}

http://kb.mozillazine.org/UserContent.css

Remember to set the toolkit.legacyUserProfileCustomizations.stylesheets preference to true, then restart.

Test page
http://silenttranslations.com/legend/legend-chapter-1/

Reference
http://searchfox.org/mozilla-release/so ... eader.html
http://searchfox.org/mozilla-release/so ... Reader.css

...

You could also style the Tranquility Reader page using the userContent.css file.

Code: Select all

/* Firefox userContent.css */

@-moz-document url-prefix("http:"), url-prefix("https:") {
  body.tranquility,
  div.tranquility_container,
  div.tranquility_innercontainer {
    padding: 0 !important; 
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
  }
}

Tranquility Reader
http://addons.mozilla.org/firefox/addon/360074

Reference
http://github.com/ushnisha/tranquility- ... uility.css

Search results for readability addons like Tranquility Reader
http://addons.mozilla.org/firefox/search/?q=readability
http://addons.mozilla.org/firefox/search/?q=readable
http://addons.mozilla.org/firefox/search/?q=reader