search

xobotyi / react-scrollbars-custom

The best React custom scrollbars component
https://xobotyi.github.io/react-scrollbars-custom/
MIT License
841 stars 75 forks source link

Scrollbar content not appearing in Safari when scrollbar height is 100% #158

Open z9170 opened 4 years ago

z9170 commented 4 years ago

I have a react-scrollbars-custom scrollbar implemented around a

tag with some text in which the width and height parameters are auto and 100% respectively. This works absolutely fine in browsers such as Firefox and Chrome but there seems to be an issue with safari in which the text inside the scrollbar component does not appear on the page. The text is present within the component still and can be observed by selecting the ScrollbarsCustom-Content class using the safari dev tools.

For the setup, I have a react component whose render function is as follows: `render() { return (

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. In hac habitasse platea dictumst quisque sagittis. Fringilla est ullamcorper eget nulla. Id leo in vitae turpis massa sed elementum tempus. Diam phasellus vestibulum lorem sed risus ultricies tristique. Consequat interdum varius sit amet mattis vulputate enim nulla. Maecenas pharetra convallis posuere morbi leo urna molestie. Facilisi morbi tempus iaculis urna id. Malesuada bibendum arcu vitae elementum curabitur vitae. Nisl suscipit adipiscing bibendum est ultricies. Duis at consectetur lorem donec massa sapien. Mattis pellentesque id nibh tortor id aliquet lectus proin. Condimentum id venenatis a condimentum vitae sapien. Mattis vulputate enim nulla aliquet porttitor lacus luctus. Lacus suspendisse faucibus interdum posuere. Facilisi cras fermentum odio eu feugiat pretium nibh ipsum. Augue lacus viverra vitae congue eu consequat ac felis. Faucibus nisl tincidunt eget nullam non. Erat velit scelerisque in dictum non consectetur.

)}`

I have some CSS on the div element but this is just a "flex: 1 1 auto;" I have also tried specifying different percentages for the scrollbar height but Safari does not like any of them.

xobotyi commented 4 years ago

Sadly Im unable to debug safari since I dont have an access to any Mac

z9170 commented 4 years ago

Hi there,

No worries. Thank you for your quick reply :)

Kind Regards, Zak

On 5 Oct 2020, at 17:51, Anton Zinovyev notifications@github.com wrote:

 Sadly Im unable to debug safari since I dont have an access to any Mac

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

trevlar commented 3 years ago

I just submitted a somewhat related issue. The problem shows up in the example code.

https://github.com/xobotyi/react-scrollbars-custom/issues/170

Get a good look at the attached screenshot.