Recently, Stack Exchange the company rolled out a new question layout.
I don't like this new layout. I want the old one back!
Recently, Stack Exchange the company rolled out a new question layout.
I don't like this new layout. I want the old one back!
Here's some CSS that puts the old layout back. Kinda. It's not perfect, but it'll do.
It also forces the numbers column on the left to be 200px wide. So it's not responsive. But if you're on a laptop or desktop, this shouldn't be an issue.
/* Fixes new question layout - kinda */
.s-post-summary {
align-items: flex-start;
}
.s-post-summary--stats {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
width: 200px;
}
.s-post-summary--stats .s-post-summary--stats-item {
display: block;
text-align: center;
}
.s-post-summary--stats .s-post-summary--stats-item.has-answers {
border: none;
}
.s-post-summary--stats .s-post-summary--stats-item .svg-icon {
display: none;
}
.s-post-summary--stats-item-number {
display: block;
font-size: 2em;
}
.s-post-summary--stats-item-unit {
display: block;
}
So, how do you use this? Some browsers let you overwrite stylesheets with your own styles. Otherwise, you can use Stylus Extension for all your overwriting needs.
:)
Removed from Chrome.