scroll horizontal css code example
Example 1: hide horizontal scrollbar css
.x-scroll-disabled {
overflow-x: hidden;
}
Example 2: smooth scroll css
html {
scroll-behavior: smooth;
}
/* No support in IE, or Safari
You can use this JS polyfill for those */
http://iamdustan.com/smoothscroll/
Example 3: tablayout horizontal scroll
In Java:
tabLayout.setTabMode(MODE_SCROLLABLE) // Default is MODE_FIXED
In XML:
app:tabMode="scrollable"
Example 4: horizontal scroll html
<div class="scrolling-wrapper">
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
</div>
.scrolling-wrapper {
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;
.card {
display: inline-block;
}
}
Example 5: css horizontal scroll
.scroll{
overflow-x: scroll;
overflow-y: hidden;
height: 80px;
white-space:nowrap
}
Example 6: how to make div scrollable horizontal
overflow-x: auto(show when needed) or hidden(never) or scroll(always scroll);