Horizontal scrolling is now almost a thing of the past for me.

Thanks to this latest userContent.CSS ( for FireFox ):

www.Cotse.NET/users/jeffrelf/userContent.CSS

....horizontal scrolling is now almost a thing of the past for me.
Also, FireFox's scrollbars now have just a slider ( i.e. no end-buttons )
and it's background is now black.
I made a note to myself to do that to Win_XP too... it I can.

Google now looks like this to me:

www.Cotse.NET/users/jeffrelf/CSS.PNG

This site:

Search.IMTranslator.NET/trans/splr.asp

....now looks like this to me:

www.Cotse.NET/users/jeffrelf/Clean.PNG

....this is how most people see it:

www.Cotse.NET/users/jeffrelf/Spam.PNG

These settings:

body, table, input, textarea { width: 45em !important; }

....are how I prevent horizontal scrolling. ( " em " is the font height )
I couldn't use the " 100% " setting because that
length gets smaller and smaller as blocks nest...
....But that's fine with me as my font is always 80 columns ( monospaced ),
so 45em is _Always_ the true screen width ( minus the margins ).

For some mysterious reason, " slider * " can't have margins...
What's ( implicitly ) nested below " slider " ? a " div " ? !
CSS settings have many hidden surpizes like that.

The following settings 1. Provide a blank line before " Google Results ",
and " Jump To " sections and 2. Prevents IFrames from overwriting content:

a[name], div[class=g], iframe {
display: block !important; margin-top: 1.1em !important; }

Also, " table { display: block !important; } " ensures that tables begin
at the left margin.

These settings are interesting:

input[type] { display: inline !important; }
input[type], select, option {
width: auto !important; height: 1.1em !important; }
input[type=text] { width: 45em !important; display: block !important; }

They allow word-length " input " items
( like " Radio Buttons ", check-boxes and submit-buttons )
to reside in the middle of a line; yet it keeps " text entry " fields
a single, full-screen width, left-justified, 80 column line.
They also make too-narrow drop-down lists ( due to poorly written HTML )
the correct width ( and height ).

These setting allow word-length ( and larger ) images
in the middle of a line:

body * img {
width: auto !important; height: auto !important;
white-space: normal !important; margin-right: .5em !important;
display: inline !important; }

But pictures at the very top of a Wiki_Pedia page are
rendered semi-incorrectly due to their funcky-ass JavaScript.
( But it's not a serious issue for me, a better view is a click away )

I used only " body * " and not " body " in order to allow
on-the-fly re-sizing of .JPG files.

For archiving purposes, my entire userContent.CSS follows...

html, html * {
background: black !important; color: rgb( 155, 111, 111 ) !important;
letter-spacing: .4px !important;
font: 22px normal Consolas,monospace !important;
line-height: 110% !important; max-width: 45em !important;
white-space: normal !important;
margin: 0 0 0 0 !important; margin-right: .5em !important;
border: 0 0 0 0 !important; padding: 0 0 0 0 !important;
text-align: left !important; border-style: none !important;
text-decoration: none !important; text-transform: none !important;
position: static !important; float: none !important;
display: inline !important; }

pre, pre *, option, option *, *[class=fixed_width]
, input div, textarea div, slider, slider *, scrollbarbutton, scrollbar {
white-space: pre !important; display: block !important;
margin-right: 0 !important; }

scrollbar, slider { width: 1em !important; }

body, table, input, textarea { width: 45em !important; }
a[name], div[class=g], iframe {
display: block !important; margin-top: 1.1em !important; }
table { display: block !important; }
input[type] { display: inline !important; }
input[type], select, option {
width: auto !important; height: 1.1em !important; }
input[type=text] { width: 45em !important; display: block !important; }

body * img {
width: auto !important; height: auto !important;
white-space: normal !important; margin-right: .5em !important;
display: inline !important; }

scrollbarbutton, style, script, noscript, * br { display: none !important; }

input br, textarea br, *[class=fixed_width] br {
display: inline !important; }

input div, textarea div { background: rgb( 99, 99, 99 ) !important; }
input div, pre { color: rgb( 166, 111, 111 ) !important; }
:focus *, :inactive { background: rgb( 0, 96, 0 ) !important; }
::-moz-selection, span[class="diffchange"]
, span[class="diff-deletedline"], span[class="diff-addedline"] {
color: rgb( 177, 255, 133 ) !important; background: black !important; }
i, b, em { color: rgb( 177, 155, 133 ) !important; }
h1, h2, h3, h4, h5, h6 { color: rgb( 155, 177, 133 ) !important; }

a[target], a[target] *, a[href], a[href] *, span[id]
, option, input, button {
color: rgb( 155, 155, 155 ) !important; }
select { color: rgb( 111, 144, 244 ) !important; }
a[target]:visited, a[target]:visited *, a[href]:visited, a[href]:visited *
, span[id]:visited, option:visited, input:visited, button:visited {
color: rgb( 177, 177, 177 ) !important; }
a[target]:hover, a[target]:hover *, a[href]:hover, a[href]:hover *
, span[id]:hover, option:hover, input:hover, button:hover {
color: rgb( 155, 255, 111 ) !important; }
marquee { -moz-binding: none !important; }
/** / @-moz-document domain(paralink.com) { iframe { } } /**/


.