Hi!, I am experiencing issues with the scrollbar lwhen using Ios devices specially in mobile, the scrollbar won’t appear in this link https://www.besocialscene.com/new-sept-homepage?hs_preview=YhTtsyAc-13258353405, There’s no issue with android and desktop as per the screenshot below, but when using iOS the scrollbar won’t appear ** [screenshots.jpg] ** This are the codes that I have used for the styline of the scrollbar ::-webkit-scrollbar{ -webkit-appearance: none; width: 7px; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: rgba(0,0,0,.5); -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); } ::-webkit-scrollbar { width: 5px; } ::-webkit-scrollbar-track { background: #f1f1f1; } ::-webkit-scrollbar-thumb { background: #707070; } ::-webkit-scrollbar-thumb:hover { background: #355cc9; } ::-webkit-overflow-scrolling:touch; { background:#707070; width: 5px; }

@chrissa0000 My appologies I misunderstood the problem. After some digging oddly enough it looks the position of the UL is causing this. try setting it to “position: absolute;”. This will cause the child elements to be cut off. To aleviate this try modifying their widths to something like 95%. Edit: “calc” as updated below might allow for more precise control over the display. .back .description ul { position: absolute; } .back .description ul .draw-border { width: calc(100% - 5px); } Let me know if this ends up being a solution for you!

Hi @Kevin-C , Thank you for the reply. When I use the Developer tools it looks okay but on the actual phone it acts like this , there is an unwanted scroll to top issue, [scrollup2.gif]

Yes it works!, Thank you so much! @Kevin-C

CSS for Scrollbar in iOS devices

Develop, Build & Integrate CMS Development

Kevin-C October 1, 2019, 5:57pm 2

Hey @chrissa0000

Looks like you’ve got this to work?

If so what was the issue?

Or might I be missing something?

See below:

Chrome

Safari

Topic		Replies	Views
Customizing a scrollbar. CMS Development	3	5395	May 26, 2017
Background Image not showing on Iphone CMS Development html , professional	1	3865	December 3, 2020
Dev Page Test CMS Development	4	1834	September 7, 2018
scrollbar in ui component CMS Development css	1	1467	April 30, 2024
Image size changes on iOS and Windows CMS Development	4	2307	September 22, 2020

CSS for Scrollbar in iOS devices

Related topics