Authorferdnyc
LicenseCC-BY-SA-3.0
Categoryuserstyles
Created
Updated
Size674 B
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
The site CSS forces overflow-x: hidden on the HTML tag, which combined with unrestrained content width means that pages grow wider than the browser if there are any large graphs or images embedded.
These adjustments get the content width under control by matching it to the browser width, and make the entire document 'overflow-x: auto' so that, worst case, you end up with a horizontal scrollbar.
/* ==UserStyle==
@name squareperl.com - 10/12/2021, 9:15:07 AM
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A new userstyle
@author Me
==/UserStyle== */
@-moz-document domain("squareperl.com") {
html { overflow-x: auto; }
body, .container { width: auto; }
@media screen and (min-width: 768px) {
.title, .content { max-width: 620px; }
}
@media screen and (min-width: 1000px) {
.title, .content { max-width: 800px; }
}
@media screen and (min-width: 1200px) {
.title, .content { max-width: 950px; }
}
@media screen and (min-width: 1600px) {
.title, .content { max-width: 1250px; }
}
}