horizontal twitter

horizontal-twitter.userscript.js

// ==UserScript==
// @name         Twitter in columns
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  What if we just used the horizontal space in timeline? (I didn't adapt other elements, you scroll past them anyway)
// @author       Patrik dudits
// @match        https://twitter.com/
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    let style=`
#timeline {
    width: 100%;
}

#page-container {
    width: 90%;
}

body {
    background-color: #f8ffff;
}

#timeline .stream-item[data-item-type="tweet"] {
    display: inline-block;
    width: 32.5%;
    vertical-align: top;
    margin-left: 0.55%;
    margin-bottom: 0.6em;
    background: transparent;
    border-top: 3px solid #116;
}`;
    let styleEl = document.createElement('style');
    styleEl.textContent = style;

    document.head.appendChild(styleEl);
})();

horizontal.css

#timeline {
    width: 100%;
}

#page-container {
    width: 90%;
}

body {
    background-color: #f8ffff;
}

#timeline .stream-item[data-item-type="tweet"] {
    display: inline-block;
    width: 32.5%;
    vertical-align: top;
    margin-left: 0.55%;
    margin-bottom: 0.6em;
    background: transparent;
    border-top: 3px solid #116;
}