Comments (4)
Shouldn't this be left to the developer to decide?
In the specifications GIF image you provided it's easy to tell it can be scrolled because the text is cropped, but in some other cases it may not be that obvious and the scrollbar (which is furtively shown on mobile devices) gives a hint to the users that the area can be scrolled. Without it they may lose a chance to know that there are more options to look at on the right.
Actually, in https://m3.material.io/components/tabs/guidelines#e8be085b-7b39-4dbe-b8ec-cfa15c8d809a is specified that
"When using scrollable tabs, the first visible tab should be offset by 52dp from the left side of the device for both web and mobile." , precisely to indicate that it is scrollable
so the scrollbar can be omitted, at least on mobile. on the web, however, it should be possible to modify it, as the standard one is unsightly
from material-web.
Shouldn't this be left to the developer to decide?
In the specifications GIF image you provided it's easy to tell it can be scrolled because the text is cropped, but in some other cases it may not be that obvious and the scrollbar (which is furtively shown on mobile devices) gives a hint to the users that the area can be scrolled. Without it they may lose a chance to know that there are more options to look at on the right.
from material-web.
perhaps there are guidelines regarding the width of items so that the last visible one is cut off
from material-web.
Speaking from memory, I'm pretty sure whether or not a scrollbar appears is dependent on the browser, OS, and user preferences. For example, in Chrome on my Android Pixel, a scrollbar does not appear on the tabs page.
We use overflow: auto
, which tells the browser to only display a scrollbar if the content is overflowing. In practice, how browsers implement this UX varies between browsers and platforms (Chrome on Windows has different scrollbar behaviors compared to Chrome on Mac OS).
You mentioned in your issue the platform is Chrome on Windows. Is there a mobile device that is displaying unexpected scrollbars?
from material-web.
Related Issues (20)
- Switch misses input event handler HOT 3
- Cannot parse some components using minify-html-literals HOT 1
- md-tabs: scroll to active tab on init shouldn't be smooth behaviour HOT 1
- Problem with scrims when multiple dialogs are opened HOT 1
- scrollable md-tabs: align active element to the middle HOT 5
- MdTextField inherits text-align from parents HOT 2
- Weird interactions between dialog and select elements on Safari HOT 4
- Better dialog customization HOT 2
- md-slider track background HOT 6
- md-menu flashes while closing HOT 4
- Text button cannot display the specified color correctly HOT 1
- md-menu/md-select overlay positions itself too far to the left side of the anchor element HOT 4
- I cannot found where the md-typescale.js is. HOT 3
- Minor FR: A sane sans serif font HOT 1
- tabs.addEventListener does not work HOT 1
- No ripple feeback when md-icon-button is clicked programmatically.
- click() on an href icon-button has no effect.
- How does someone build and run this locally like in enclave? HOT 2
- Dialog header is bold when it shouldn't be HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from material-web.