Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

-moz-scrollbars-vertical equivalent for Chrome/Opera/Safari?

Tags:

css

scrollbar

IE6, IE7, and IE8 display a vertical scroll bar for the page by default even if it is not scrollable. Chrome and Firefox do not do this (I'm assuming Opera and Safari do not as well). You can accomplish this same behavior in FireFox using the CSS:

body { overflow: -moz-scrollbars-vertical; }

Is there any way to force the visible scrollbar in the other three browsers? Or even better, a standard way of doing it?

like image 585
Langdon Avatar asked Nov 25 '09 23:11

Langdon


People also ask

What should I replace Google Chrome with?

Microsoft Edge. The new Microsoft Edge is built on the Chromium engine so it's as compatible as Chrome itself, but with that Microsoft spin.

What are the 5 most popular web browser?

A look into the market share trends of the 5 most popular desktop web browsers; Microsoft Internet Explorer, Mozilla Firefox, Google Chrome, Apple's Safari, and Opera.

Which browser is most similar to Safari?

There are more than 100 alternatives to Safari for a variety of platforms, including Linux, Windows, Mac, Android and Android Tablet. The best alternative is Mozilla Firefox, which is both free and Open Source. Other great apps like Safari are Brave, Google Chrome, Tor Browser and Vivaldi.

Which is the best browser to use on Mac?

Google Chrome is the number one choice of internet browsers, but poor privacy stops it from being the best. With its ease of use, vast number of extensions and synchronization features, it's no surprise many feel Chrome is the best option for macOS.


1 Answers

Update

You may (in addition) need to include -ms-overflow-y and/or -moz-scrollbars-vertical, as mentioned in this other StackOverflow post:

html {
    overflow: -moz-scrollbars-vertical; /* For FF */
    -ms-overflow-y: scroll; /* For IE */
    overflow-y: scroll; /* For others & old IE */
}

Original

html { overflow-y: scroll; }

See "overflow-y" at W3Schools

Tested & verified (successfully) in:

  • FF 7
  • Chrome 15
  • IE 5+6+7+8+9+10(platform preview) w/IETester
  • Opera 11.52
  • Safari/Win 5.1.1

Full example

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
    html { overflow-y: scroll; }
</style>
</head>
<body>
    Test content
</body>
</html>
like image 85
Dan Phillimore Avatar answered Sep 29 '22 21:09

Dan Phillimore