As xec mentioned in his answer, this behavior is caused by the @-ms-viewport setting. The good news is that you do not have to remove this setting to get the scrollbars back (in our case we rely on the @-ms-viewport setting for responsive web design). You can use the -ms-overflow-style to define the overflow behavoir, … Read more
First, make a display: block of your table then, set overflow-x: to auto. table { display: block; overflow-x: auto; white-space: nowrap; } Nice and clean. No superfluous formatting. Here are more involved examples with scrolling table captions from a page on my website. If an issue is taken about cells not filling the entire table, … Read more
DISCLAIMER: overlay has been deprecated. You can still use this if you absolutely have to, but try not to. This only works on WebKit browsers, but I like it a lot. Will behave like auto on other browsers. .yourContent{ overflow-y: overlay; } This will make the scrollbar appear only as an overlay, thus not affecting … Read more
You can use css like this: overflow-y: scroll; overflow-x: hidden;
a little plugin for it. (function($) { $.fn.hasScrollBar = function() { return this.get(0).scrollHeight > this.height(); } })(jQuery); use it like this, $(‘#my_div1’).hasScrollBar(); // returns true if there’s a `vertical` scrollbar, false otherwise.. tested working on Firefox, Chrome, IE6,7,8 but not working properly on body tag selector demo Edit I found out that when you have … Read more
I thought it would be helpful to consolidate the latest information on scroll bars, CSS, and browser compatibility. Scroll Bar CSS Support Currently, there exists no cross-browser scroll bar CSS styling definitions. The W3C article I mention at the end has the following statement and was recently updated (10 Oct 2014): Some browsers (IE, Konqueror) … Read more
Wrap it in a scroll viewer: <ScrollViewer> <TextBlock /> </ScrollViewer> NOTE this answer applies to a TextBlock (a read-only text element) as asked for in the original question. If you want to show scroll bars in a TextBox (an editable text element) then use the ScrollViewer attached properties: <TextBox ScrollViewer.HorizontalScrollBarVisibility=”Disabled” ScrollViewer.VerticalScrollBarVisibility=”Auto” /> Valid values for … Read more
As of late 2018, there is now limited customization available in Firefox! See these answers: https://stackoverflow.com/a/54101063/405015 https://stackoverflow.com/a/53739309/405015 And this for background info: https://bugzilla.mozilla.org/show_bug.cgi?id=1460109 There’s no Firefox equivalent to ::-webkit-scrollbar and friends. You’ll have to stick with JavaScript. Plenty of people would like this feature, see: https://bugzilla.mozilla.org/show_bug.cgi?id=77790 As far as JavaScript replacements go, you can try: … Read more
Add this to your <head> section: <script> function resizeIframe(obj) { obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + ‘px’; } </script> And change your iframe to this: <iframe src=”https://stackoverflow.com/questions/9975810/…” frameborder=”0″ scrolling=”no” onload=”resizeIframe(this)” /> As found on sitepoint discussion.
WebKit supports scrollbar pseudo elements that can be hidden with standard CSS rules: #element::-webkit-scrollbar { display: none; } If you want all scrollbars hidden, use ::-webkit-scrollbar { display: none; } I’m not sure about restoring – this did work, but there might be a right way to do it: ::-webkit-scrollbar { display: block; } You … Read more